/*
Theme Name: GINREETMACHINERY
Theme URI: https://example.com
Author: GINREETMACHINERY开发组
Author URI: https://example.com
Description: 农机企业展示网站主题。首页为四页一体化（SPA）结构：主页（含关于我们、产品应用、服务支持）/产品中心/新闻/联系我们整合在同一首页，通过顶部导航切换；另含独立「关于我们」页面（单板块：标题与正文直接在「页面 → 所有页面 → 关于我们」里编辑，支持插图、小标题、列表与表格，右侧照片取自页面特色图片）、站点地图页面（按栏目分组列出全站链接，页面文字可在后台逐条编辑）与产品/新闻详情页、分类归档页。设计风格为清新自然绿系配色、系统 UI 字体栈、白底圆角卡片、透明吸顶导航。全部文案、图片、链接均支持后台「首页内容」菜单在线编辑，文字与图片均可添加超链接；主导航栏目改由 WordPress 原生「外观 → 菜单」管理（增删排序、父子层级均免费可用）；页脚含「Sitemap」栏目，机器可读的 XML 站点地图按服务器能力自适应输出地址（干净路径 /sitemap.xml、index.php 前缀型 /index.php/sitemap.xml、朴素 /?ginreet_sitemap=1，并在 robots.txt 中同步声明）；导航栏右侧内置多语言切换器（中文/英语/西班牙语/葡萄牙语/德语/法语/俄语/土耳其语/印尼语/阿拉伯语，纯国旗+文字展示，配置对应网站后可跳转独立站点）。
Version: 5.11.14
Requires at least: 5.0
Tested up to: 6.5
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ginreet-machinery
Tags: 企业,农机,农业,响应式
*/

/* ========== Reset & Base ========== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  /* 主题调色板 */
  --green:#55a630;
  --green-dark:#438b22;
  --green-deep:#213631;
  --near-black:#0f1a17;
  --text:#213631;
  --gray:#565D66;
  --gray-mid:#969696;
  --gray-light:#F0F2F3;
  --gray-lighter:#F8FAFB;
  --white:#FFFFFF;
  --light:#FBFCFC;
  /* 辅助色（保留少量旧色用于产品区分） */
  --gold:#F9A825;
  --gold-bg:#FFF8E1;
  --teal:#00838F;
  --teal-bg:#E0F7FA;
  --steel:#37474F;
  --steel-bg:#ECEFF1;
  --green-bg:#F0F7EB;
  /* 设计令牌 */
  --shadow:0 2px 12px rgba(33,54,49,.06);
  --shadow-md:0 8px 30px rgba(33,54,49,.10);
  --shadow-lg:0 16px 50px rgba(33,54,49,.14);
  --radius:16px;
  --radius-sm:10px;
  --radius-lg:24px;
  --transition:all .35s cubic-bezier(.4,0,.2,1);
  --container:1200px;
  --header-h:75px;
}
html{scroll-behavior:smooth;scrollbar-gutter:stable}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--text);
  background:var(--white);
  line-height:1.7;
  overflow-x:hidden;
  /* v5.11.5：overflow-x:hidden 会把 body 变成「滚动容器」，导致所有后代的
     position:sticky 失效。clip 同样能裁掉横向溢出，但**不会**创建滚动容器。
     渐进增强：不认识 clip 的老浏览器会整条忽略、退回上面的 hidden ——
     只是 sticky 不生效（回到旧表现），布局与裁剪效果不受影响。
     （v5.11.6 注：这条是为产品中心二级导航 .pc-sub-nav 的吸顶保留的，
      与「关于我们右侧照片是否跟随滚动」无关 —— 照片跟随已按用户要求取消。） */
  overflow-x:clip;
  font-weight:400;
}
a{text-decoration:none;color:inherit;transition:var(--transition)}
img{max-width:100%;display:block}
ul{list-style:none}
h1,h2,h3,h4,h5,h6{color:var(--near-black);font-weight:600;line-height:1.3}

/* ========== Header（顶部导航栏：绿渐变 + 白字） ========== */
header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  height:var(--header-h);
  transition:var(--transition);
  background:linear-gradient(135deg,var(--green-deep) 0%,var(--green) 100%);
  color:var(--white);
  box-shadow:0 2px 12px rgba(33,54,49,.10);
}
/* v4.2.3：取消 .transparent / .scrolled 视觉差异——导航栏统一使用绿渐变，
 * 不再有过渡到白底的过程；保留两个类名仅作状态占位以兼容 JS。 */
header.transparent,header.scrolled{
  background:linear-gradient(135deg,var(--green-deep) 0%,var(--green) 100%);
  color:var(--white);
  box-shadow:0 2px 12px rgba(33,54,49,.10);
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
header .logo,
header .nav-menu a,
header .nav-lang-btn{color:var(--white)}
header .nav-menu a:hover{background:rgba(255,255,255,.18);color:var(--white)}
header .nav-menu a.active{color:#fff;font-weight:600}
header .nav-menu a.active::after{
  content:'';position:absolute;bottom:2px;left:18px;right:18px;
  height:2px;background:var(--white);border-radius:2px;
}
header .nav-toggle span{background:var(--white)}
nav{
  max-width:var(--container);margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 32px;height:100%;
}
.logo{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:700;color:var(--near-black);transition:var(--transition)}
.logo svg{width:40px;height:40px;flex-shrink:0}
.nav-menu{display:flex;gap:4px;align-items:center}
.nav-menu a{
  font-size:15px;font-weight:500;color:var(--text);
  padding:8px 18px;border-radius:var(--radius-sm);transition:var(--transition);
  position:relative;
}
.nav-menu a:hover{color:var(--green);background:var(--green-bg)}
.nav-menu a.active{color:var(--green-dark);font-weight:600}
.nav-menu a.active::after{
  content:'';position:absolute;bottom:2px;left:18px;right:18px;
  height:2px;background:var(--green);border-radius:2px;
}
.nav-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px}
.nav-toggle span{width:22px;height:2px;background:var(--white);border-radius:2px;transition:var(--transition)}

/* ========== 导航栏语言切换器（v2.5.0） ========== */
.nav-lang{position:relative;display:flex;align-items:center;flex-shrink:0}
.nav-lang-btn{
  display:flex;align-items:center;gap:7px;cursor:pointer;
  padding:7px 14px;border-radius:999px;
  background:transparent;border:1px solid rgba(255,255,255,.45);
  color:var(--white);font-size:14px;font-weight:500;font-family:inherit;
  transition:var(--transition);line-height:1;
}
.nav-lang-btn:hover{border-color:var(--white);color:var(--white);background:rgba(255,255,255,.12)}
.nav-lang-globe{width:17px;height:17px;flex-shrink:0}
.nav-lang-current{white-space:nowrap}
.nav-lang-caret{width:11px;height:11px;flex-shrink:0;transition:transform .25s ease}
.nav-lang.open .nav-lang-caret{transform:rotate(180deg)}
/* 兼容保留 .transparent 类名的占位样式——现在与默认态一致（均显示绿渐变） */
header.transparent .nav-lang-btn{color:var(--white);border-color:rgba(255,255,255,.45)}
header.transparent .nav-lang-btn:hover{color:var(--white);border-color:var(--white);background:rgba(255,255,255,.12)}
/* 下拉面板 */
.nav-lang-menu{
  position:absolute;top:calc(100% + 10px);right:0;min-width:178px;
  background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-md);
  padding:8px;margin:0;z-index:1200;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .25s ease,transform .25s ease,visibility .25s;
}
.nav-lang.open .nav-lang-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-lang-menu li button,
.nav-lang-menu li a,
.nav-lang-menu li .nav-lang-plain{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:9px 12px;border:none;border-radius:var(--radius-sm);
  background:transparent;color:var(--text);font-size:14px;font-weight:500;
  font-family:inherit;cursor:pointer;text-align:left;text-decoration:none;
  box-sizing:border-box;transition:var(--transition);
}
.nav-lang-menu li button:hover,
.nav-lang-menu li a:hover{background:var(--green-bg);color:var(--green-dark)}
.nav-lang-menu li .nav-lang-plain{cursor:default}
.nav-lang-menu li.active button,
.nav-lang-menu li.active a,
.nav-lang-menu li.active .nav-lang-plain{background:var(--green-bg);color:var(--green-dark);font-weight:600}
.nav-lang-menu li.active button::after,
.nav-lang-menu li.active a::after,
.nav-lang-menu li.active .nav-lang-plain::after{
  content:'';margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--green);
}
.lang-flag{width:22px;height:15px;border-radius:3px;overflow:hidden;flex-shrink:0;box-shadow:0 0 0 1px rgba(0,0,0,.10)}
/* v3.2.0：已移除 Google 网站翻译，不再需要隐藏其注入 UI */
body{top:0!important}

/* ========== Hero（两栏布局） ========== */
.hero{
  min-height:100vh;display:flex;align-items:center;
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--near-black) 0%,var(--green-deep) 35%,var(--green-dark) 65%,var(--green) 100%);
  padding-top:var(--header-h);
}
.hero::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 60% 80% at 80% 20%,rgba(85,166,48,.18),transparent),
    radial-gradient(ellipse 50% 70% at 20% 80%,rgba(67,139,34,.12),transparent);
}
.hero-pattern{
  position:absolute;inset:0;opacity:.04;
  background-image:
    repeating-linear-gradient(0deg,transparent,transparent 80px,rgba(255,255,255,.5) 80px,rgba(255,255,255,.5) 81px),
    repeating-linear-gradient(90deg,transparent,transparent 80px,rgba(255,255,255,.5) 80px,rgba(255,255,255,.5) 81px);
}
.hero-content{
  position:relative;z-index:2;
  max-width:var(--container);margin:0 auto;
  width:100%;padding:0 32px;
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  animation:heroFade 1s ease-out;
}
@keyframes heroFade{
from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}
}
.hero-text h1{
  font-size:48px;font-weight:700;line-height:1.2;margin-bottom:20px;color:#fff;
}
.hero-text h1 span{color:var(--gold)}
.hero-text p{
  font-size:17px;color:rgba(255,255,255,.85);margin-bottom:32px;line-height:1.8;
}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap}
.hero-visual{
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:center;
}
.hero-visual img{
  max-width:100%;border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
}
.hero-illustration{
  width:100%;display:flex;justify-content:center;align-items:center;
}
.hero-illustration svg{width:min(480px,100%);height:auto}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 32px;border-radius:50px;font-size:15px;font-weight:600;
  transition:var(--transition);cursor:pointer;border:none;
}
.btn-primary{background:var(--green);color:var(--white)}
.btn-primary:hover{background:var(--green-dark);transform:translateY(-2px);box-shadow:0 8px 24px rgba(85,166,48,.35)}
.btn-outline{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.4)}
.btn-outline:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.7)}
.btn-light{background:var(--white);color:var(--near-black)}
.btn-light:hover{background:var(--green);color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-md)}

/* ========== Section Common ========== */
.section-title{text-align:center;margin-bottom:56px}
.section-title .eyebrow{
  display:inline-block;font-size:13px;font-weight:600;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--green);background:var(--green-bg);
  padding:4px 16px;border-radius:50px;margin-bottom:16px;
}
.section-title h2{font-size:34px;font-weight:700;color:var(--near-black);margin-bottom:12px}
.section-title h2 mark{background:none;color:var(--gray-mid);font-weight:500}
.section-title p{font-size:16px;color:var(--gray);max-width:600px;margin:0 auto}

/* ========== Solutions Strip ========== */
.solutions{
  padding:80px 32px;
  background:var(--near-black);
  color:#fff;text-align:center;
}
.solutions-inner{max-width:900px;margin:0 auto}
.solutions h2{font-size:32px;font-weight:700;margin-bottom:14px;color:#fff}
.solutions p{font-size:16px;opacity:.8;margin-bottom:30px;max-width:600px;margin-left:auto;margin-right:auto}
.solutions-tags{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:30px}
.solutions-tags span,.solutions-tags a{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);
  padding:8px 20px;border-radius:50px;font-size:14px;font-weight:500;
  transition:var(--transition);
}
.solutions-tags a:hover{background:var(--green);border-color:var(--green);color:#fff}

/* About Intro 现在是主页的第一个 section，需要给吸顶导航留出空间。
 * v4.2.1：把原先写在 .home-products 上的 padding-top 下放到这里。
 * v4.2.5：与下方 home-products 同为白底，压缩底部留白避免大段空白。 */
.spa-page .about-intro{
  padding-top:calc(80px + var(--header-h));
  padding-bottom:32px;
}

/* ========== Home Products (4 blocks) ========== */
/* v4.2.4：产品图统一改为 4:3 比例（800x600），与品类页 .cat-pro-img 保持一致。
 *        产品卡片不再显示产品标题（标题信息在后台仍可编辑，仅前端不渲染）。
 * v4.2.5：顶部 padding 由 80px 降为 32px，与上方 about-intro 拼接，避免大段留白。 */
.home-products{
  padding:32px 32px 80px;
  background:#fff;
}
.home-products .section-title{margin-bottom:48px}
.home-products-grid{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:repeat(2,1fr);gap:28px;
}
.product-block{
  display:flex;flex-direction:column;
  background:var(--green-deep);
  border-radius:16px;overflow:hidden;
  transition:var(--transition);
  position:relative;
}
.product-block:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.product-visual{
  aspect-ratio:4/3;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--green-deep) 0%,var(--green) 100%);
}
.product-visual img{width:100%;height:100%;object-fit:cover;display:block}
.product-visual svg{width:100%;height:100%}
.product-info{padding:28px;color:#fff}
.product-tag{
  display:inline-block;
  background:rgba(249,168,37,.25);color:#F9A825;
  padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;
  margin-bottom:10px;letter-spacing:.5px;
}
.product-info h3{font-size:22px;font-weight:700;color:#fff;margin-bottom:8px}
.product-info p{font-size:14px;color:rgba(255,255,255,.85);line-height:1.65;margin-bottom:14px;min-height:46px}
.product-info .btn-text{color:#fff;font-size:14px;font-weight:600}
.product-info .btn-text .arrow{transition:transform .3s ease}
.product-info .btn-text:hover{color:#F9A825}
.product-info .btn-text:hover .arrow{transform:translateX(4px)}
.home-products-cta{text-align:center;margin-top:48px}

/* ========== Contact CTA ========== */
.contact-cta{
  background:var(--green-deep);color:#fff;
  padding:80px 32px;
}
.contact-inner{max-width:1200px;margin:0 auto}
.contact-info h2{font-size:32px;font-weight:700;color:#fff;margin-bottom:14px}
.contact-info>p{font-size:16px;opacity:.85;margin-bottom:30px;max-width:600px}
.contact-list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:14px;
}
.contact-list li{
  display:flex;align-items:center;gap:14px;
  font-size:15px;color:rgba(255,255,255,.92);
}
.contact-list li svg{
  width:24px;height:24px;flex-shrink:0;
  background:rgba(255,255,255,.1);padding:4px;border-radius:8px;
}

/* ========== Footer ========== */
footer{
  background:#1a2e25;color:#fff;
  padding:60px 32px 24px;
}
.footer-inner{max-width:1280px;margin:0 auto}
/* v5.9.0：页脚由「品牌 + 3 栏」扩为「品牌 + 4 栏」——新增 Sitemap 栏目。
   列宽从 1.5fr+3×1fr 改为 1.5fr+4×1fr，gap 同步收窄（40 → 32）
   以免 1280px 容器下每列被压得过窄；980px 断点仍回落为 2 列。 */
.footer-top{
  display:grid;
  grid-template-columns:1.5fr repeat(4,1fr);
  gap:32px;
  padding-bottom:40px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-brand .logo{
  display:flex;align-items:center;gap:10px;
  font-size:18px;font-weight:700;color:#fff;margin-bottom:16px;
}
.footer-brand p{
  font-size:14px;color:rgba(255,255,255,.7);line-height:1.7;margin:0;
}
.footer-col h4{
  font-size:14px;font-weight:700;color:#fff;
  margin-bottom:18px;letter-spacing:.5px;
}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.footer-col li a{
  font-size:13.5px;color:rgba(255,255,255,.7);
  text-decoration:none;transition:var(--transition);
}
.footer-col li a:hover{color:#F9A825}
.footer-bottom{padding-top:24px;text-align:center}
.footer-bottom p{font-size:13px;color:rgba(255,255,255,.55);margin:0}

/* ========== Scroll Animations ========== */
/* v4.2.2 修复：JS 一直为 .fade-up 加 .visible，但 CSS 旧版匹配的是 .in，
   导致所有含 fade-up 的区块停留在 opacity:0，页面看起来全空白。
   现在主选择器改为 .visible，并把 .in 作为向后兼容的别名保留。 */
.fade-up{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.fade-up.visible,.fade-up.in{opacity:1;transform:none}
/* v3.5.0：切页时视口内元素瞬时呈现（禁用过渡），滚动渐入仍保留动画 */
.spa-page:not(.active) .fade-up{opacity:0;transform:translateY(20px)}
.spa-page.active .fade-up{opacity:0;transform:translateY(20px)}
.spa-page.active .fade-up.visible,.spa-page.active .fade-up.in{opacity:1;transform:none}

/* ========== Inner Pages (index.php) ========== */
.page-main{padding:calc(var(--header-h) + 40px) 32px 80px;background:#fff;min-height:60vh}
.page-container{max-width:900px;margin:0 auto}
.page-title{font-size:32px;font-weight:700;color:var(--near-black);margin-bottom:24px}
.page-content{font-size:16px;color:var(--gray);line-height:1.85}
.page-content p{margin-bottom:18px}
.page-content h2{font-size:24px;font-weight:700;color:var(--near-black);margin:32px 0 16px}
.page-content h3{font-size:20px;font-weight:700;color:var(--near-black);margin:24px 0 12px}
.page-content ul,.page-content ol{margin:0 0 18px 24px}
.page-content li{margin-bottom:8px}
.page-content img{max-width:100%;height:auto;border-radius:10px;margin:16px 0}

/* v4.2.3：内页横幅整体取消——所有 .page-hero 块已从模板移除，本段 CSS 仅作保留以防 HTML 内残留 */

/* ========== Responsive (中屏) ========== */
@media(max-width:980px){
  .footer-top{grid-template-columns:1fr 1fr;gap:30px}
  .contact-info h2{font-size:26px}
  .page-main{padding:calc(var(--header-h) + 30px) 20px 60px}
  .page-title{font-size:26px}
  /* v4.3.1 产品中心中屏：入口卡片改单列 */
  .pc-entry-grid-section{padding:calc(var(--header-h) + 30px) 20px 56px}
  .pc-entry-grid{grid-template-columns:1fr}
  .pc-entry-card{grid-template-columns:1fr 1.1fr}
  .pc-entry-info{padding:24px 22px}
  .pc-entry-info h3{font-size:20px}
  .pc-entry-info p{font-size:14px;margin-bottom:16px}
  .pc-cat-block{padding:48px 20px}
  .pc-cat-head{margin-bottom:28px}
  .pc-cat-head h2{font-size:26px}
  .pc-pro-grid{grid-template-columns:repeat(2,1fr);gap:18px}
  /* v5.3.0 归档页面包屑条中屏内边距 */
  .pc-archive-bar{padding:18px 20px 14px}
}

/* ========== Responsive (小屏 ≤600px) ========== */
@media(max-width:600px){
  .pc-entry-card{grid-template-columns:1fr}
  .pc-entry-visual{aspect-ratio:16/10}
  .pc-entry-info{padding:22px 20px}
  .pc-entry-info h3{font-size:18px}
  .pc-cat-head h2{font-size:22px}
  .pc-pro-grid{grid-template-columns:1fr;gap:16px}
  /* v4.3.5：二级导航小屏字号与内边距微调 */
  .pc-sub-nav-link{padding:11px 10px;font-size:13px}
}

/* ==========================================================
   About Page
   ========================================================== */
.about-intro{padding:80px 32px;background:var(--white)}
.about-intro-inner{
  max-width:var(--container);margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}
.about-intro-eyebrow{
  font-size:13px;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;color:var(--green);margin-bottom:12px;
}
.about-intro-text h2{
  font-size:36px;font-weight:700;color:var(--near-black);
  margin-bottom:18px;line-height:1.3;
}
.about-intro-text p{
  font-size:15.5px;color:var(--gray);line-height:1.85;margin-bottom:14px;
}
.about-intro-text .btn-text{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:600;color:var(--green-dark);
  text-decoration:none;margin-top:10px;
}
.about-intro-text .btn-text .arrow{transition:transform .3s ease}
.about-intro-text .btn-text:hover{color:var(--green)}
.about-intro-text .btn-text:hover .arrow{transform:translateX(4px)}
.about-intro-visual{border-radius:14px;overflow:hidden}
.about-intro-visual img{width:100%;height:auto;display:block}

/* v4.1.5 关于我们：产品应用 + 服务中心统一为简洁左图右文单栏目布局 */
/* 标题前的短绿线（heading-mark） */

/* ==========================================================
   Form
   ========================================================== */
.cp-info-section{padding:calc(var(--header-h) + 40px) 32px 60px;background:#F8FAF8}
.cp-info-grid{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.cp-info-card{
  background:#fff;border-radius:14px;padding:28px 24px;
  border:1px solid #E5EFE5;
  transition:var(--transition);text-align:left;
  display:flex;flex-direction:column;gap:10px;
  text-decoration:none;color:inherit;
}
.cp-info-card:hover{box-shadow:var(--shadow-md);border-color:var(--green)}
.cp-info-card-linked{cursor:pointer}
.cp-info-icon{
  width:48px;height:48px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
}
.cp-info-icon.t-tractor{background:var(--green)}
.cp-info-icon.t-orchard{background:#E65100}
.cp-info-icon.t-mini{background:var(--teal)}
.cp-info-icon.t-loader{background:var(--steel)}
.cp-info-icon svg{width:24px;height:24px}
.cp-info-label{
  font-size:13px;font-weight:600;color:var(--gray);
  letter-spacing:.5px;text-transform:uppercase;
}
.cp-info-value{
  font-size:15.5px;font-weight:600;color:var(--near-black);line-height:1.5;
}

.cp-form-map-section{padding:60px 32px 80px;background:#fff}
.cp-form-map-inner{max-width:880px;margin:0 auto}
.cp-form-area{}
.cp-form-area h2{
  font-size:28px;font-weight:700;color:var(--near-black);margin-bottom:12px;
}
.cp-form-desc{font-size:15px;color:var(--gray);margin-bottom:24px}
.cp-form-alert{
  padding:14px 18px;border-radius:10px;margin-bottom:20px;
  font-size:14px;font-weight:500;
}
.cp-form-alert-success{background:#E8F5E9;color:#2E7D32;border:1px solid #A5D6A7}
.cp-form-alert-error{background:#FFEBEE;color:#C62828;border:1px solid #EF9A9A}
.cp-contact-form{display:flex;flex-direction:column;gap:18px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-group{display:flex;flex-direction:column;gap:6px}
.form-group label{font-size:14px;font-weight:600;color:var(--near-black)}
.form-group label .required{color:#C62828}
.form-group input,.form-group textarea{
  width:100%;padding:12px 14px;
  border:1px solid #DDD;border-radius:10px;
  font-size:15px;font-family:inherit;color:var(--near-black);
  background:#fff;transition:var(--transition);
}
.form-group input:focus,.form-group textarea:focus{
  outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(85,166,48,.15)
}
.form-group textarea{resize:vertical;min-height:120px;font-size:16px}
.cp-submit-btn{
  align-self:flex-start;padding:12px 32px;
  background:var(--green);color:#fff;border:none;border-radius:30px;
  font-size:15px;font-weight:600;cursor:pointer;
  transition:var(--transition);
}
.cp-submit-btn:hover:not(:disabled){background:var(--green-dark)}
.cp-submit-btn:disabled{opacity:.6;cursor:not-allowed}
.form-note{font-size:13px;color:var(--gray);margin:0}

/* ========== Customizer 预览表单光标修正（v5.11.4） ==========
 * WordPress 核心（WP_Customize_Manager::customize_preview_loading_style()，
 * WP 4.2+）会在「外观 → 自定义」的预览窗口里给所有 POST 表单打上
 * customize-unpreviewable 标记，并输出 cursor:not-allowed !important ——
 * 表单输入框/按钮全部显示「禁止」光标，用户以为表单坏了。
 * 本主题表单是 AJAX 提交（v4.0.2），在预览里照样能正常输入与提交，
 * WP 这条一刀切属于误伤，这里按字段类型恢复真实可用的光标。
 * 该类只存在于自定义器预览，前台正常访问永远不会命中，无副作用。
 * 注意 cursor 是继承属性：WP 在 form 上设了 not-allowed，
 * textarea 等未点名字段也会继承，所以 input/textarea/select 要全覆盖。 */
form.customize-unpreviewable input,
form.customize-unpreviewable textarea,
form.customize-unpreviewable select{cursor:text !important}
form.customize-unpreviewable button{cursor:pointer !important}

/* ========== Contact Form Alert (v4.0.0) ========== */

/* v4.0.2：提交按钮在 AJAX 提交过程中被禁用， */

/* ==========================================================
   Footer about
   ========================================================== */

/* ==================================================
   首页一体化（SPA）页面切换
   ================================================== */
.spa-app{position:relative}
.spa-page{display:none}
.spa-page.active{display:block}

/* v2.9.0：淡入动画只做透明度变化（去掉 14px 位移），配合 JS 瞬时回顶， */

/* ==================================================
   移动端导航：更紧凑高度 + 菜单修正
   ================================================== */

/* ---------- 触屏设备：用 :active 替代 hover 反馈 ---------- */

/* ---------- 小屏（≤500px）逐区块收窄 ---------- */

/* ========== Products Page (v4.3.1：移除 hero，首屏为 4 个入口卡片 + 品类分区) ========== */

/* v4.3.5：产品中心页二级导航（白底、4 栏目、sticky 吸在主导航下方）——点击后
 * 平滑滚动到下方对应 pc-cat-block 分区（main.js scrollToAnchor 处理）。
 * 设计要点：(1) sticky top = var(--header-h)，始终吸在主导航下方；
 * (2) 4 列等分网格，激活态下边线 3px 绿 + 文字加深；(3) z-index 99 低于
 * 主导航的 z-index，避免遮盖主导航的下拉菜单。 */
.pc-sub-nav{
  position:sticky;top:var(--header-h);
  background:#fff;border-bottom:1px solid #E5EFE5;
  z-index:99;
}
.pc-sub-nav-inner{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,1fr);
}
.pc-sub-nav-link{
  display:flex;align-items:center;justify-content:center;
  padding:14px 16px;
  font-size:15px;font-weight:500;color:var(--gray);
  text-decoration:none;
  border-bottom:3px solid transparent;
  margin-bottom:-1px;
  transition:var(--transition);
  white-space:nowrap;
}
.pc-sub-nav-link:hover{color:var(--green-dark)}
.pc-sub-nav-link.active{
  color:var(--green);font-weight:600;
  border-bottom-color:var(--green);
}
/* v5.1.0：产品详情页用的二级导航变体——取消 sticky 吸顶（详情页
   顶部已有 sticky 主导航，再叠一层会拥挤），保持 4 栏布局与高亮
   视觉；is-active 复用 .active 的绿下边线 + 加粗效果。 */
.pc-sub-nav-detail{
  position:static;top:auto;
  border-bottom:1px solid #E5EFE5;
  margin-bottom:20px;
}
.pc-sub-nav-link.is-active{
  color:var(--green);font-weight:600;
  border-bottom-color:var(--green);
}

/* v5.3.0：产品中心二级导航「独立页面」版式（pc-sub-nav-page）——用于
 * 产品中心页 /products/ 与 4 个分类归档页 /product-category/{slug}/。
 * 设计要点：
 *   (1) sticky 吸在固定主导航下方，长产品列表滚动时仍可随时切分类；
 *   (2) 调用方必须给容器预留 padding-top:var(--header-h)，否则首屏
 *       （scroll=0）导航会被固定主导航条整条盖住——这正是 v5.2.x 中
 *       分类归档页「看不到二级导航」的原因（.pc-archive-page 当时无此留白，
 *       且导航用的是 .pc-sub-nav-detail 的 position:static）。
 *   (3) 当前分类在 'page' 版式下由 <span> 渲染（指向当前 URL 的自链接
 *       会让人误以为「点击无反应」），故去掉 pointer 暗示。 */
.pc-sub-nav-page{
  position:sticky;top:var(--header-h);
  border-bottom:1px solid #E5EFE5;
  margin-bottom:0;
}
.pc-sub-nav-page .pc-sub-nav-link.is-active{cursor:default}

/* v5.3.0：产品分类归档页 / 产品归档页的容器。
 *   补齐固定主导航高度留白，让首屏二级导航与内容都落在导航条下方。 */
.pc-archive-page{
  padding-top:var(--header-h);
  padding-bottom:40px;
  background:#fff;
}
/* 归档页顶部面包屑条（首页 / 产品中心 / 当前分类） */
.pc-archive-bar{
  max-width:var(--container);margin:0 auto;
  padding:22px 32px 18px;
}
.pc-archive-bar .detail-breadcrumb{margin-bottom:0}

/* v4.3.1：入口卡片区顶部增加吸顶导航高度留白，避免首屏卡片紧贴导航 */
.pc-entry-grid-section{
  padding:calc(var(--header-h) + 40px) 32px 72px;background:#fff;
}
.pc-entry-grid{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:repeat(2,1fr);gap:24px;
}
.pc-entry-card{
  display:grid;grid-template-columns:1fr 1fr;gap:0;
  background:#F8FAF8;border:1px solid #E8F0E8;border-radius:16px;overflow:hidden;
  text-decoration:none;color:var(--near-black);
  transition:var(--transition);
}
.pc-entry-card:hover{
  box-shadow:var(--shadow-md);border-color:var(--green);transform:translateY(-4px);
}
.pc-entry-visual{
  background:#fff;display:flex;align-items:center;justify-content:center;
  overflow:hidden;aspect-ratio:4/3;
}
.pc-entry-visual img{width:100%;height:100%;object-fit:cover;display:block}
.pc-entry-visual svg{width:100%;height:100%;display:block}
.pc-entry-info{
  padding:32px 28px;display:flex;flex-direction:column;justify-content:center;
  background:#F8FAF8;
}
.pc-entry-info h3{
  font-size:22px;font-weight:700;color:var(--near-black);margin:0 0 12px;line-height:1.3;
}
.pc-entry-info p{
  font-size:14.5px;color:var(--gray);line-height:1.7;margin:0 0 20px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.pc-entry-btn{
  display:inline-flex;align-items:center;justify-content:center;
  align-self:flex-start;min-width:120px;height:40px;padding:0 20px;
  border:1.5px solid var(--green);border-radius:30px;
  background:#fff;color:var(--green);font-size:14px;font-weight:600;
  transition:var(--transition);
}
.pc-entry-card:hover .pc-entry-btn{
  background:var(--green);color:#fff;
}

/* 品类分区：每个分块一个 eyebrow + 中文类目标题 + 产品卡片 grid；奇偶
 * 块背景交替（白 / 极浅绿），呈现连续滚动阅读的视觉节奏。 */
.pc-cat-block{padding:64px 32px;background:#F8FAF8}
.pc-cat-block + .pc-cat-block{background:#fff}
.pc-cat-head{
  max-width:var(--container);margin:0 auto 40px;text-align:center;
}
.pc-cat-head .eyebrow{
  display:inline-block;font-size:13px;font-weight:600;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--green);background:var(--green-bg);
  padding:4px 16px;border-radius:50px;margin-bottom:14px;
}
.pc-cat-head h2{
  font-size:30px;font-weight:700;color:var(--near-black);margin:0;line-height:1.3;
}

/* 产品卡片：与品类页 .cat-pro-card 视觉统一（图片 + 标签 + 标题 +
 * 描述 + view more 圆角按钮），保证两种入口的产品卡片观感一致。 */
.pc-pro-grid{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
}
.pc-pro-card{
  background:#fff;border:1px solid #E5EFE5;border-radius:14px;overflow:hidden;
  transition:var(--transition);text-decoration:none;color:var(--near-black);
  display:flex;flex-direction:column;
}
.pc-pro-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);border-color:var(--green)}
.pc-pro-img{aspect-ratio:4/3;overflow:hidden;background:#F8FAF8}
.pc-pro-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.pc-pro-card:hover .pc-pro-img img{transform:scale(1.05)}
.pc-pro-img svg{width:100%;height:100%;display:block}
.pc-pro-info{padding:24px 22px 28px;flex:1;display:flex;flex-direction:column}
.pc-pro-tag{
  display:inline-block;align-self:flex-start;
  background:var(--green-bg);color:var(--green-dark);
  padding:3px 12px;border-radius:20px;font-size:12px;font-weight:600;
  margin-bottom:10px;letter-spacing:.3px;
}
.pc-pro-title{font-size:18px;font-weight:700;color:var(--near-black);margin:0 0 8px;line-height:1.4}
.pc-pro-desc{font-size:14px;color:var(--gray);line-height:1.65;flex:1;margin:0 0 16px;min-height:46px}
.pc-pro-more{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:140px;height:42px;padding:0 20px;border-radius:30px;
  background:var(--green);color:#fff;font-size:14px;font-weight:600;
  transition:var(--transition);align-self:flex-start;gap:6px;
}
.pc-pro-more .arrow{transition:transform .3s ease}
.pc-pro-card:hover .pc-pro-more{background:var(--green-dark)}
.pc-pro-card:hover .pc-pro-more .arrow{transform:translateX(4px)}
.pc-pro-empty{
  grid-column:1/-1;text-align:center;padding:60px 20px;
  color:var(--gray);font-size:14px;background:#fff;border-radius:14px;
  border:1px dashed #E5EFE5;
}

.pc-cta{background:var(--near-black);color:#fff;text-align:center;padding:80px 32px}
.pc-cta-inner{max-width:900px;margin:0 auto}
.pc-cta h2{font-size:32px;font-weight:700;color:#fff;margin-bottom:14px}
.pc-cta p{font-size:16px;opacity:.8;margin-bottom:30px;max-width:600px;margin-left:auto;margin-right:auto}

/* v4.3.2：原「Category Page (cat-tabs / cat-pro)」整套样式（4 个二级品类页
 * 已删除）一并清理——入口卡片现通过锚点滚动到产品中心下方的 pc-cat-block
 * 分区，对应样式见上文 .pc-cat-block / .pc-pro-grid / .pc-pro-card。 */

/* ========== About App / Service (v4.2.6：精简为左文右图 / 左图右文单行版式) ========== */
/* about-app：左侧文字 + 右侧图片（与 about-intro 同向） */
.about-app-section{padding:80px 32px;background:#F8FAF8}
.about-app-inner{
  max-width:var(--container);margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}
.about-app-eyebrow,
.about-service-eyebrow{
  font-size:13px;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;color:var(--green);margin-bottom:12px;
}
.about-app-text h2,
.about-service-text h2{
  font-size:36px;font-weight:700;color:var(--near-black);
  margin-bottom:18px;line-height:1.3;
}
.about-app-text p,
.about-service-text p{
  font-size:15.5px;color:var(--gray);line-height:1.85;margin-bottom:14px;
}
.about-app-text .btn-text,
.about-service-text .btn-text{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:600;color:var(--green-dark);
  text-decoration:none;margin-top:10px;
}
.about-app-text .btn-text .arrow,
.about-service-text .btn-text .arrow{transition:transform .3s ease}
.about-app-text .btn-text:hover,
.about-service-text .btn-text:hover{color:var(--green)}
.about-app-text .btn-text:hover .arrow,
.about-service-text .btn-text:hover .arrow{transform:translateX(4px)}
.about-app-visual,
.about-service-visual{border-radius:14px;overflow:hidden}
.about-app-visual img,
.about-service-visual img{width:100%;height:auto;display:block}

/* about-service：左侧图片 + 右侧文字（与 about-app 镜像） */
.about-service-section{padding:80px 32px;background:#fff}
.about-service-inner{
  max-width:var(--container);margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
}

/* ========== News Page (grid + cta) ========== */
/* v4.2.7：新闻中心顶部 = 吸顶导航高度 + 40px 留白，避免第一个新闻卡紧贴导航 */
.news-grid-section{padding:calc(var(--header-h) + 40px) 32px 80px;background:#F8FAF8}
.news-grid{
  max-width:1280px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.news-card{
  background:#fff;border-radius:14px;overflow:hidden;
  border:1px solid #E5EFE5;
  transition:var(--transition);text-decoration:none;color:var(--near-black);
  display:flex;flex-direction:column;
}
.news-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);border-color:var(--green)}
.news-card-img{aspect-ratio:16/9;overflow:hidden;background:#F8FAF8}
.news-card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.news-card:hover .news-card-img img{transform:scale(1.05)}
.news-card-body{padding:22px;flex:1;display:flex;flex-direction:column}
.news-card-date{font-size:13px;color:var(--gray);margin-bottom:8px}
.news-card-body h3{font-size:18px;font-weight:700;color:var(--near-black);margin-bottom:10px;line-height:1.4}
.news-card-body p{font-size:14px;color:var(--gray);line-height:1.65;flex:1;margin:0}

.news-cta{background:var(--near-black);color:#fff;text-align:center;padding:80px 32px}
.news-cta-inner{max-width:900px;margin:0 auto}
.news-cta h2{font-size:32px;font-weight:700;color:#fff;margin-bottom:14px}
.news-cta p{font-size:16px;opacity:.8;margin-bottom:30px;max-width:600px;margin-left:auto;margin-right:auto}

/* ========== Detail Page (hero / body / card / feature) ========== */
/* v4.2.3：详情页 hero 已删除，仅保留 .detail-body 顶部为导航让出空间 */
/* v5.4.0：顶部 padding 由 calc(var(--header-h) + 40px) 收回为 20px。
 *   原因：.detail-body 的祖先 .single-detail 已经用
 *   padding:calc(var(--header-h) + 40px) 32px 80px 预留过固定导航高度，
 *   两层叠加 = 230px 顶部留白 —— 二级导航与产品标题之间空得离谱
 *   （用户反馈「二级导航下面留白空间有点大」）。
 *   横向 padding 同步收回为 0：祖先 .single-detail 已有 32px 内边距
 *   （小屏 20px），再叠一层会让 880px 内容区实际只剩 816px 可用。 */
.detail-body{max-width:880px;margin:0 auto;padding:20px 0 40px;background:#fff}
.detail-back{
  display:inline-block;font-size:14px;color:var(--green-dark);
  text-decoration:none;margin-bottom:20px;font-weight:600;
}
.detail-back:hover{color:var(--green)}
.detail-cat{
  display:inline-block;background:var(--green-bg);color:var(--green-dark);
  padding:4px 14px;border-radius:20px;font-size:12px;font-weight:600;
  margin-bottom:14px;letter-spacing:.5px;
}
.detail-title{font-size:32px;font-weight:700;color:var(--near-black);margin-bottom:24px;line-height:1.3}
.detail-visual{margin:0 0 32px;border-radius:14px;overflow:hidden}
.detail-visual img{width:100%;height:auto;display:block}
.detail-card{
  background:#fff;border:1px solid #E5EFE5;border-radius:12px;
  padding:28px;margin-bottom:24px;
}
.detail-card h3{font-size:18px;font-weight:700;color:var(--near-black);margin-bottom:14px}
.detail-card p{font-size:15px;color:var(--gray);line-height:1.8;margin-bottom:10px}
.feature-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.feature-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;background:#F8FAF8;border-radius:8px;
  font-size:14px;color:var(--near-black);
}
.feature-item::before{content:'▸';color:var(--green);font-weight:700;font-size:16px}
.feature-item a{color:var(--green-dark);text-decoration:none;font-weight:600}
.feature-item a:hover{color:var(--green)}

/* ============================================================
 * v4.4.0 SEO/GEO 升级新增样式：
 * 1. .visually-hidden —— 屏幕阅读器可读、视觉隐藏工具类
 *    （用于整站唯一 H1，避免破坏 SPA 视觉）
 * 2. .faq-section —— FAQ 区块（FAQPage schema + 折叠 Q&A）
 * ============================================================ */

/* visually-hidden —— WAI-ARIA 标准隐藏法（视觉不可见、屏幕阅读器可读） */
.visually-hidden{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* FAQ 区块 */
.faq-section{
  max-width:1080px;margin:0 auto;
  padding:80px 32px;
  background:var(--gray-bg);
}
.faq-section .section-title{text-align:center;margin-bottom:40px}
.faq-section .section-title h2{margin:14px 0 12px}
.faq-section .section-title p{margin:0 auto}
.faq-list{
  display:flex;flex-direction:column;gap:14px;
  max-width:820px;margin:0 auto;
}
.faq-item{
  background:#fff;
  border:1px solid #E5EFE5;
  border-radius:12px;
  padding:18px 22px;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.faq-item:hover{border-color:var(--green)}
.faq-item[open]{
  border-color:var(--green);
  box-shadow:0 4px 16px rgba(85,166,48,.08);
}
.faq-item summary{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;cursor:pointer;
  font-size:16px;font-weight:600;color:var(--near-black);
  list-style:none;
  outline:none;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:4px}
.faq-q-text{flex:1;line-height:1.5}
.faq-icon{
  flex:0 0 22px;height:22px;border-radius:50%;
  background:var(--green-bg);color:var(--green);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:700;
  transition:transform .25s ease,background .25s ease;
  position:relative;
}
.faq-icon::before,
.faq-icon::after{
  content:'';position:absolute;background:currentColor;
}
.faq-icon::before{width:10px;height:2px}
.faq-icon::after{height:10px;width:2px;transition:transform .25s ease}
.faq-item[open] .faq-icon::after{transform:scaleY(0)}
.faq-item[open] .faq-icon{background:var(--green);color:#fff}
.faq-a{
  margin-top:14px;padding-top:14px;
  border-top:1px solid #E5EFE5;
  color:var(--gray);font-size:15px;line-height:1.8;
}
.faq-a p{margin:0}

/* FAQ 响应式 */
@media(max-width:760px){
  .faq-section{padding:56px 20px}
  .faq-section .section-title h2{font-size:26px}
  .faq-item{padding:16px 18px}
  .faq-item summary{font-size:15px}
  .faq-a{font-size:14px}
}

/* ============================================================
 * v4.4.2 CPT public 化新增样式：
 * 1. .single-detail / .detail-breadcrumb —— 单产品/新闻详情页
 *    （/products/{slug}/ 与 /news/{slug}/）的版式与导航
 * 2. .detail-tag —— 产品参数标签（型号规格行）
 * 3. .detail-cta —— 详情页底部 CTA
 * ============================================================ */

.single-detail{
  max-width:1080px;
  margin:0 auto;
  padding:calc(var(--header-h) + 40px) 32px 80px;
}
.single-detail-inner{max-width:880px;margin:0 auto}

/* 面包屑 */
.detail-breadcrumb{
  font-size:13px;color:var(--gray);
  margin-bottom:24px;
}
.detail-breadcrumb ol{
  list-style:none;padding:0;margin:0;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
}
.detail-breadcrumb li{display:inline-flex;align-items:center;gap:8px}
.detail-breadcrumb a{color:var(--green);text-decoration:none}
.detail-breadcrumb a:hover{text-decoration:underline}
.detail-breadcrumb .sep{color:#bbb}
.detail-breadcrumb [aria-current="page"]{color:var(--near-black);font-weight:500}

/* 产品参数标签（与卡片上的 pc-pro-tag 视觉统一） */
.detail-tag{
  display:inline-block;
  font-size:12px;font-weight:600;
  background:var(--green-bg);color:var(--green);
  padding:4px 12px;border-radius:50px;
  margin:6px 0 0 8px;
  vertical-align:middle;
}

/* 详情页底部 CTA */
.detail-cta{margin-top:32px;text-align:center}
.detail-cta .btn{display:inline-block;padding:14px 36px;font-size:15px}

/* 单产品/新闻页响应式 */
@media(max-width:760px){
  .single-detail{padding:calc(var(--header-h) + 24px) 20px 60px}
  .detail-tag{display:inline-block;margin:8px 0 0}
}


/* ============================================================
 * v5.7.0 新增：独立「关于我们」页面（page-about.php）
 * 单板块版式 —— 左侧文字介绍 + 右侧照片。
 * 设计要点：
 *   1. 顶部留白 = calc(var(--header-h) + 36px)，避免被 position:fixed
 *      的导航栏遮挡（与 .cp-info-section / .pc-entry-grid-section 同规格）；
 *   2. 用浅灰底 + 白卡片的层次，与首页 .about-intro（纯白无卡片）
 *      区分开，让独立页面看起来是「一个完整的板块」；
 *   3. 980px 以下纵向堆叠且文字在上、照片在下（阅读顺序更自然）；
 *   4. v5.11.5：文案一多，右侧图片就会「孤零零悬在半空」与长文失衡。
 *      改为图片 sticky 跟随滚动（980px 以下堆叠时自动取消），并把列宽
 *      从 1fr 换成 minmax(0,1fr) —— 纯 1fr 会被超长英文单词 / URL 撑破。
 * ============================================================ */

.page-about-section{
  padding:calc(var(--header-h) + 36px) 32px 80px;
  background:#F8FAF8;
  min-height:70vh;
}
.page-about-bar{
  max-width:var(--container);margin:0 auto 24px;
}
.page-about-bar .detail-breadcrumb{margin-bottom:0}

.page-about-card{
  max-width:var(--container);margin:0 auto;
  background:var(--white);
  border:1px solid #E8F0E8;
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  padding:56px;
  /* v5.11.5：① minmax(0,1fr) —— 纯 1fr 会被超长英文单词 / URL 撑破，
     长文案下左侧会挤掉右侧空间；② align-items 由 center 改 start，
     文字很长时从头排起（右列照片顶部对齐，见下）。 */
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:56px;align-items:start;
}
/* v5.11.6：正文里插了图片时自动改单栏通宽 —— 图片已在文中按编辑顺序排好，
   再显示右侧那张独立照片就成了「同一张图出现两次」。 */
.page-about-card-wide{grid-template-columns:minmax(0,1fr)}
/* 文字块单独垂直居中：文案短时仍居中对齐（与旧版观感一致），
   文案长时行高由文字自身决定，居中不产生副作用。 */
.page-about-text{align-self:center;min-width:0}

.page-about-eyebrow{
  font-size:13px;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;color:var(--green);margin-bottom:12px;
}
.page-about-text h1{
  font-size:36px;font-weight:700;color:var(--near-black);
  margin-bottom:18px;line-height:1.3;
}
.page-about-text p{
  font-size:15.5px;color:var(--gray);line-height:1.85;margin-bottom:14px;
}
.page-about-text p:last-of-type{margin-bottom:0}
.page-about-text .btn-text{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:600;color:var(--green-dark);
  text-decoration:none;margin-top:22px;
}
.page-about-text .btn-text .arrow{transition:transform .3s ease}
.page-about-text .btn-text:hover{color:var(--green)}
.page-about-text .btn-text:hover .arrow{transform:translateX(4px)}

/* v5.11.6：这里**刻意不用** position:sticky —— 用户明确不要照片跟随滚动。
   文案很长时照片留在右列顶部（align-self:start），下方留白由卡片自身收容，
   比居中悬空自然；想要跟随的话把下面两行的注释打开即可（同时要求祖先链上
   没有 overflow:hidden —— body 已在 v5.11.5 改成 clip，条件满足）。
   图片一律保持原始比例：width:100% + height:auto，不拉伸、
   不用 object-fit:cover（那会把横构图照片裁成一条竖条）。 */
.page-about-visual{
  border-radius:14px;overflow:hidden;background:var(--green-bg);
  align-self:start;
  /* position:sticky;top:calc(var(--header-h) + 24px); */
}
.page-about-visual img{width:100%;height:auto;display:block;margin:0 auto}
/* 未配置图片时的 SVG 占位：同样按 3:2 比例自适应宽度 */
.page-about-visual svg{width:100%;height:auto;display:block;margin:0 auto}

/* 关于我们独立页面响应式 */
@media(max-width:980px){
  .page-about-section{padding:calc(var(--header-h) + 28px) 24px 64px}
  .page-about-card{
    grid-template-columns:minmax(0,1fr);gap:32px;padding:36px 28px;
  }
  /* 单列堆叠时照片紧跟文字下方；卡片已在上面改成单列，无需额外处理 */
  .page-about-visual{align-self:auto}
  .page-about-text{align-self:auto}
  .page-about-text h1{font-size:30px}
}
@media(max-width:600px){
  .page-about-section{padding:calc(var(--header-h) + 20px) 18px 56px}
  .page-about-card{padding:26px 20px;border-radius:var(--radius-sm)}
  .page-about-text h1{font-size:25px}
  .page-about-text p{font-size:15px}
  .page-about-bar{margin-bottom:18px}
}

/* ============================================================
 * v5.9.0 新增：站点地图页面（page-sitemap.php）
 * 版式 —— 抬头 + 分组卡片（主要页面 / 产品中心 / 新闻动态）+ XML 入口条。
 * 设计要点：
 *   1. 顶部留白 = calc(var(--header-h) + 36px)，与 .page-about-section
 *      同规格，避免被 position:fixed 的导航栏遮挡；
 *   2. 卡片式分组 + 浅灰底，与「关于我们」独立页面保持同一套视觉语言；
 *   3. 长列表用 CSS columns 分栏（而非 grid），条目数差异大时列高更均衡；
 *   4. 产品卡片跨整行 —— 它内部还要再分 2 列放 4 个产品分类。
 * ============================================================ */

.page-sitemap-section{
  padding:calc(var(--header-h) + 36px) 32px 80px;
  background:#F8FAF8;
  min-height:70vh;
}
.page-sitemap-bar{max-width:var(--container);margin:0 auto 24px}
.page-sitemap-bar .detail-breadcrumb{margin-bottom:0}

.page-sitemap-head{max-width:var(--container);margin:0 auto 30px}
.page-sitemap-eyebrow{
  font-size:13px;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;color:var(--green);margin-bottom:12px;
}
.page-sitemap-head h1{
  font-size:36px;font-weight:700;color:var(--near-black);
  margin-bottom:14px;line-height:1.3;
}
.page-sitemap-head p{
  font-size:15.5px;color:var(--gray);line-height:1.8;
  margin:0;max-width:760px;
}

/* grid-auto-flow:dense —— 产品卡片跨整行（grid-column:1 / -1）会把自动
   光标推到下一行，导致后面出现的「新闻动态」卡片被挤到第三行、第二行
   右侧空出一大块。dense 让后备放置回填空位，三张卡片的排布稳定为
   「主要页面(左) | 新闻动态(右)」+「产品中心(跨整行)」。 */
.page-sitemap-grid{
  max-width:var(--container);margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;
  grid-auto-flow:dense;
}
.sitemap-card{
  background:var(--white);
  border:1px solid #E8F0E8;border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  padding:32px;
}
/* 产品卡片跨整行：内部还要横向排 4 个产品分类 */
.sitemap-card-products{grid-column:1 / -1}
.sitemap-card-head{margin-bottom:20px}
.sitemap-card-head h2{
  font-size:20px;font-weight:700;color:var(--near-black);margin:0 0 6px;
}
.sitemap-card-head p{font-size:13.5px;color:var(--gray);margin:0;line-height:1.6}

.sitemap-links{
  list-style:none;padding:0;margin:0;
  columns:2;column-gap:28px;
}
.sitemap-links li{margin:0 0 9px;break-inside:avoid}
.sitemap-links li a{
  position:relative;display:inline-block;padding-left:14px;
  font-size:14px;color:var(--gray);line-height:1.6;
  text-decoration:none;transition:var(--transition);
}
.sitemap-links li a::before{
  content:'';position:absolute;left:0;top:9px;
  width:5px;height:5px;border-radius:50%;
  background:#C9DCC9;transition:var(--transition);
}
.sitemap-links li a:hover{color:var(--green)}
.sitemap-links li a:hover::before{background:var(--green)}

.sitemap-sections{display:grid;grid-template-columns:1fr 1fr;gap:28px 32px}
.sitemap-section h3{font-size:16px;font-weight:700;margin:0 0 12px}
.sitemap-section h3 a{color:var(--green-dark);text-decoration:none;transition:var(--transition)}
.sitemap-section h3 a:hover{color:var(--green)}
/* 分类内的产品列表保持单列 —— 分类卡片本身已经是 2 列布局 */
.sitemap-section .sitemap-links{columns:1}
.sitemap-none{font-size:13.5px;color:#9AA8A0;margin:0}
.page-sitemap-empty{
  max-width:var(--container);margin:0 auto;padding:48px 0;
  font-size:15px;color:var(--gray);
}

.page-sitemap-xml{
  max-width:var(--container);margin:24px auto 0;
  background:var(--white);border:1px solid #E8F0E8;
  border-radius:var(--radius);padding:20px 28px;
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;
}
.page-sitemap-xml-text strong{display:block;font-size:14px;color:var(--near-black);margin-bottom:4px}
.page-sitemap-xml-text span{font-size:13px;color:var(--gray)}
.page-sitemap-xml-link{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13px;color:var(--green-dark);text-decoration:none;
  background:var(--green-bg);padding:8px 14px;border-radius:8px;
  word-break:break-all;transition:var(--transition);
}
.page-sitemap-xml-link:hover{background:#DCEFDC;color:var(--green)}
/* v5.11.0：XML 条的两段文字被隐藏时（后台填 `-`），
   别把链接一个人推到最右边 */
.page-sitemap-xml-bare{justify-content:flex-start}

/* 站点地图页面响应式 */
@media(max-width:980px){
  .page-sitemap-section{padding:calc(var(--header-h) + 28px) 24px 64px}
  .page-sitemap-grid{grid-template-columns:1fr}
  .sitemap-card-products{grid-column:auto}
  .sitemap-card{padding:28px 24px}
  .sitemap-sections{grid-template-columns:1fr;gap:24px}
  .page-sitemap-head h1{font-size:30px}
}
@media(max-width:600px){
  .page-sitemap-section{padding:calc(var(--header-h) + 20px) 18px 56px}
  .sitemap-card{padding:22px 18px;border-radius:var(--radius-sm)}
  .page-sitemap-head h1{font-size:25px}
  .page-sitemap-head p{font-size:15px}
  .sitemap-links{columns:1}
  .page-sitemap-bar{margin-bottom:18px}
  .page-sitemap-xml{padding:18px 20px}
}

/* ============================================================
 * v5.11.6 新增：页面正文富文本排版（.page-rich）
 *
 * 「关于我们 / Sitemap」两页的正文改走 the_content() 后，编辑器里能排的
 * 元素（小标题 / 列表 / 引用 / 表格 / 图片 / 分隔线）都必须有对应样式，
 * 否则会出现「后台排好了、前台不长那样」。
 *
 * 作用域刻意限定在 .page-rich 内：既覆盖 .page-about-body /
 * .page-sitemap-body，又不会动到其它模板的同类标签。
 * ============================================================ */
.page-rich{font-size:15.5px;color:var(--gray);line-height:1.85}
.page-rich > *:first-child{margin-top:0}
.page-rich > *:last-child{margin-bottom:0}
.page-rich p{margin-bottom:14px}
.page-rich h2,.page-rich h3,.page-rich h4,.page-rich h5,.page-rich h6{color:var(--near-black);line-height:1.4}
.page-rich h2{font-size:22px;margin:28px 0 12px}
.page-rich h3{font-size:18px;margin:22px 0 10px}
.page-rich h4,.page-rich h5,.page-rich h6{font-size:16px;margin:18px 0 8px}
/* 全局 ul 被 reset 成 list-style:none —— 正文列表必须显式恢复 */
.page-rich ul,.page-rich ol{margin:0 0 14px 22px}
.page-rich ul{list-style:disc}
.page-rich ol{list-style:decimal}
.page-rich li{margin-bottom:6px}
.page-rich li > ul,.page-rich li > ol{margin:6px 0 0 20px}
.page-rich strong,.page-rich b{color:var(--near-black);font-weight:600}
.page-rich em,.page-rich i{font-style:italic}
.page-rich a{color:var(--green-dark);text-decoration:underline;text-underline-offset:2px}
.page-rich a:hover{color:var(--green)}
/* 插图保持原始比例，不拉伸；圆角与卡片同语言 */
.page-rich img{width:auto;max-width:100%;height:auto;border-radius:var(--radius-sm);margin:6px 0}
.page-rich figure{margin:0 0 16px}
.page-rich figure img{margin:0}
.page-rich figcaption{font-size:13px;color:var(--gray-mid);margin-top:6px}
.page-rich blockquote{
  margin:18px 0;padding:12px 18px;color:var(--near-black);
  border-left:3px solid var(--green);background:var(--green-bg);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
}
.page-rich hr{border:none;border-top:1px solid #E8F0E8;margin:26px 0}
.page-rich table{width:100%;border-collapse:collapse;margin-bottom:16px;font-size:14.5px}
.page-rich th,.page-rich td{border:1px solid #E8F0E8;padding:10px 12px;text-align:left;vertical-align:top}
.page-rich th{background:var(--green-bg);color:var(--near-black);font-weight:600}
.page-rich iframe,.page-rich video{max-width:100%}
/* 编辑器里的对齐 / 画廊：不要让 gallery 里多出一圈项目符号 */
.page-rich .alignleft{float:left;margin:6px 18px 10px 0}
.page-rich .alignright{float:right;margin:6px 0 10px 18px}
.page-rich .aligncenter{display:block;margin-left:auto;margin-right:auto}
.page-rich .alignwide,.page-rich .alignfull{width:100%}
.page-rich .wp-block-gallery,.page-rich ul.wp-block-gallery{list-style:none;margin-left:0;padding-left:0}
.page-rich .wp-block-gallery figure{margin-bottom:0}

@media(max-width:600px){
  .page-rich{font-size:15px}
  .page-rich h2{font-size:20px}
  .page-rich h3{font-size:17px}
  .page-rich .alignleft,.page-rich .alignright{float:none;display:block;margin:10px auto}
}
