/* =============================================================
   base.css  ·  XY 项目基础层
   设计语言：墨绿 + 陶土 + 米白  ·  命名空间 xy-
   仅含：设计令牌、reset、原子工具类。页面级样式见各 *.css
   ============================================================= */

/* ---------- 设计令牌 ---------- */
:root{
  /* 主色 · 墨绿（沉稳 / 专业 / 信任） */
  --xy-green:        #1f3d2e;
  --xy-green-2:      #2d5240;
  --xy-green-3:      #3d6650;
  --xy-green-soft:   #e7efe9;

  /* 点缀 · 陶土（温暖 / 活力 / 行动） */
  --xy-clay:         #c97a4a;
  --xy-clay-2:       #b86a3a;
  --xy-clay-soft:    #f6e7da;

  /* 中性 · 米白 / 暖灰 / 墨 */
  --xy-cream:        #f7f3ec;   /* 页面底 */
  --xy-paper:        #ffffff;   /* 卡片底 */
  --xy-sand:         #ece7dc;   /* 分隔区 */
  --xy-line:         #e2ddd0;   /* 描边 */
  --xy-ink:          #1a1a1a;   /* 主文字 */
  --xy-ink-2:        #4d4d4d;   /* 次文字 */
  --xy-ink-3:        #8a8579;   /* 弱文字 */

  /* 字体 */
  --xy-font:         -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --xy-font-mono:    "SF Mono", "JetBrains Mono", Consolas, "Courier New", monospace;

  /* 节奏 */
  --xy-wrap:         1200px;
  --xy-gap:          24px;
  --xy-radius:       14px;
  --xy-radius-sm:    8px;
  --xy-radius-lg:    22px;

  /* 阴影 */
  --xy-shadow:       0 10px 30px -12px rgba(31,61,46,.18);
  --xy-shadow-sm:    0 4px 14px -6px rgba(31,61,46,.10);
  --xy-shadow-lg:    0 24px 60px -20px rgba(31,61,46,.28);

  /* 动效 */
  --xy-ease:         cubic-bezier(.22,.61,.36,1);
  --xy-dur:          .28s;

  /* 层级 */
  --xy-z-header:     100;
  --xy-z-footbar:    90;
  --xy-z-mask:       95;
  --xy-z-modal:      200;
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--xy-font);
  font-size:15px;
  line-height:1.75;
  color:var(--xy-ink);
  background:var(--xy-cream);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
a{ color:var(--xy-green); text-decoration:none; transition:color var(--xy-dur) var(--xy-ease); }
a:hover{ color:var(--xy-clay); }
img{ max-width:100%; height:auto; display:block; border:0; }
button{ font-family:inherit; cursor:pointer; border:0; background:none; color:inherit; }
input,textarea,select{ font-family:inherit; font-size:inherit; color:inherit; }
table{ border-collapse:collapse; width:100%; }
hr{ border:0; border-top:1px solid var(--xy-line); margin:24px 0; }

/* 标题字距质感 */
h1,h2,h3,h4{ font-weight:700; letter-spacing:.5px; color:var(--xy-ink); line-height:1.3; }

/* ---------- 容器 ---------- */
.xy-wrap{
  width:100%;
  max-width:var(--xy-wrap);
  margin:0 auto;
  padding:0 20px;
}

/* ---------- 显示控制（PC 显 / 移动显） ---------- */
.xy-show-pc{ display:block; }
.xy-show-mb{ display:none; }

/* ---------- 文字工具 ---------- */
.xy-eyebrow{
  display:inline-block;
  font-size:12px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--xy-clay);
  font-weight:600;
  padding:4px 12px;
  border:1px solid var(--xy-clay);
  border-radius:999px;
  background:var(--xy-clay-soft);
}
.xy-quiet{ color:var(--xy-ink-3); }
.xy-mono{ font-family:var(--xy-font-mono); }

/* ---------- 按钮 ---------- */
.xy-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 26px;
  border-radius:999px;
  font-size:15px;
  font-weight:600;
  letter-spacing:.5px;
  transition:all var(--xy-dur) var(--xy-ease);
  white-space:nowrap;
}
.xy-btn--primary{ background:var(--xy-green); color:#fff; }
.xy-btn--primary:hover{ background:var(--xy-green-2); color:#fff; transform:translateY(-2px); box-shadow:var(--xy-shadow); }
.xy-btn--clay{ background:var(--xy-clay); color:#fff; }
.xy-btn--clay:hover{ background:var(--xy-clay-2); color:#fff; transform:translateY(-2px); box-shadow:var(--xy-shadow); }
.xy-btn--ghost{ background:transparent; color:var(--xy-green); border:1.5px solid var(--xy-green); }
.xy-btn--ghost:hover{ background:var(--xy-green); color:#fff; }

/* ---------- 区块标题组 ---------- */
.xy-head{ text-align:center; max-width:760px; margin:0 auto 28px; }
.xy-head h2{
  font-size:32px;
  margin:14px 0 12px;
  position:relative;
}
.xy-head h2::after{
  content:"";
  display:block;
  width:48px;
  height:3px;
  margin:16px auto 0;
  background:linear-gradient(90deg,var(--xy-clay),var(--xy-green));
  border-radius:2px;
}
.xy-head p{ color:var(--xy-ink-2); font-size:15px; }

/* ---------- 通用卡片底 ---------- */
.xy-card{
  background:var(--xy-paper);
  border:1px solid var(--xy-line);
  border-radius:var(--xy-radius);
  transition:transform var(--xy-dur) var(--xy-ease), box-shadow var(--xy-dur) var(--xy-ease), border-color var(--xy-dur) var(--xy-ease);
}
.xy-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--xy-shadow);
  border-color:transparent;
}

/* ---------- 滚动条 / 选中 ---------- */
::selection{ background:var(--xy-green); color:#fff; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--xy-sand); }
::-webkit-scrollbar-thumb{ background:var(--xy-green-3); border-radius:6px; }
::-webkit-scrollbar-thumb:hover{ background:var(--xy-green); }

/* ---------- 入场动画基类 ---------- */
.xy-reveal{ opacity:0; transform:translateY(24px); transition:opacity .6s var(--xy-ease), transform .6s var(--xy-ease); }
.xy-reveal.is-in{ opacity:1; transform:none; }

/* ---------- 移动端 ---------- */
@media screen and (max-width:768px){
  body{ font-size:14px; }
  .xy-wrap{ padding:0 14px; }
  .xy-show-pc{ display:none !important; }
  .xy-show-mb{ display:block; }
  .xy-head h2{ font-size:24px; }
  .xy-head{ margin-bottom:28px; }
}

/* =============================================================
   全站布局组件 · header / footer / modal / footbar / backtop
   所有页面 include head/foot 共用，务必放全站样式表
   ============================================================= */

/* ---------- 站头 ---------- */
.xy-site-header{ position:sticky; top:0; z-index:var(--xy-z-header); background:var(--xy-paper); box-shadow:0 1px 0 var(--xy-line); }
.xy-topbar{ background:var(--xy-green); color:#fff; font-size:13px; }
.xy-topbar__inner{ display:flex; justify-content:flex-end; gap:28px; padding:8px 20px; max-width:var(--xy-wrap); margin:0 auto; }
.xy-topbar__inner span{ display:inline-flex; align-items:center; gap:6px; opacity:.92; }
.xy-topbar__inner i{ opacity:.9; }

.xy-topnav{ border-bottom:1px solid var(--xy-line); }
.xy-topnav.is-fixed{ position:fixed; top:0; left:0; right:0; background:var(--xy-paper); box-shadow:var(--xy-shadow-sm); z-index:var(--xy-z-header); }
.xy-topnav__inner{ display:flex; align-items:center; justify-content:space-between; height:72px; }
.xy-logo h1{ font-size:24px; margin:0; }
.xy-logo h1 a{ color:var(--xy-green); font-weight:800; letter-spacing:1px; }
.xy-logo img{ max-height:48px; width:auto; }
.xy-nav ul{ display:flex; gap:4px; }
.xy-nav li{ position:relative; }
.xy-nav li a{ display:block; padding:10px 18px; font-size:15px; color:var(--xy-ink); border-radius:8px; font-weight:500; transition:all var(--xy-dur) var(--xy-ease); }
.xy-nav li a:hover{ color:var(--xy-green); background:var(--xy-green-soft); }
.xy-nav li.is-active > a{ color:var(--xy-green); font-weight:700; }
.xy-nav li.is-active::after{ content:""; position:absolute; left:18px; right:18px; bottom:4px; height:2px; background:var(--xy-clay); border-radius:2px; }

/* ---------- 移动端头部 ---------- */
.xy-mheader{ display:none; }

/* ---------- 内页 banner ---------- */
.xy-banner{ position:relative; }
.xy-banner__swiper{ width:100%; }
.xy-banner .swiper-slide{ aspect-ratio:1200/360; background:var(--xy-sand); }
.xy-banner .swiper-slide img{ width:100%; height:100%; object-fit:cover; }
.xy-banner .swiper-pagination-bullet{ background:#fff; opacity:.6; }
.xy-banner .swiper-pagination-bullet-active{ background:var(--xy-clay); opacity:1; }
.xy-banner .swiper-button-prev,.xy-banner .swiper-button-next{ background:rgba(31,61,46,.5); color:#fff; width:40px; height:40px; border-radius:50%; }
.xy-banner .swiper-button-prev::after,.xy-banner .swiper-button-next::after{ font-size:18px; }

/* ---------- 站底 ---------- */
.xy-site-footer{ background:var(--xy-green); color:#dfe7e1; padding:56px 0 0; }
.xy-footer__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,.12); }
.xy-footer__brand .xy-footer__logo{ margin-bottom:14px; }
.xy-footer__brand .xy-footer__logo img{ max-height:44px; }
.xy-footer__desc{ font-size:13px; line-height:1.8; color:#b8c5bd; margin-bottom:16px; }
.xy-footer__social{ display:flex; gap:10px; }
.xy-footer__social a{ width:36px; height:36px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.1); border-radius:50%; color:#fff; transition:all var(--xy-dur) var(--xy-ease); }
.xy-footer__social a:hover{ background:var(--xy-clay); transform:translateY(-2px); }
.xy-footer__col h4{ color:#fff; font-size:16px; margin-bottom:16px; position:relative; padding-bottom:10px; }
.xy-footer__col h4::after{ content:""; position:absolute; left:0; bottom:0; width:24px; height:2px; background:var(--xy-clay); }
.xy-footer__links li{ margin-bottom:10px; }
.xy-footer__links a{ color:#b8c5bd; font-size:14px; transition:all var(--xy-dur) var(--xy-ease); display:inline-block; }
.xy-footer__links a:hover{ color:var(--xy-clay); padding-left:4px; }
.xy-footer__guard li{ display:flex; gap:10px; margin-bottom:14px; align-items:flex-start; }
.xy-footer__guard i{ color:var(--xy-clay); flex-shrink:0; margin-top:2px; }
.xy-footer__guard b{ display:block; color:#fff; font-size:14px; margin-bottom:2px; }
.xy-footer__guard span{ font-size:12px; color:#9aaaa0; }
.xy-footer__bottom{ padding:22px 0 28px; text-align:center; font-size:13px; color:#9aaaa0; }
.xy-footer__bottom p{ margin-bottom:6px; }
.xy-footer__bottom a{ color:#b8c5bd; }
.xy-footer__bottom a:hover{ color:var(--xy-clay); }
.xy-footer__disclaimer{ font-size:12px; color:#7d8d83; }

/* ---------- 悬浮 CTA ---------- */
.xy-footbar{ display:none; position:fixed; bottom:0; left:0; right:0; z-index:var(--xy-z-footbar); background:var(--xy-paper); box-shadow:0 -4px 20px rgba(31,61,46,.12); border-top:1px solid var(--xy-line); }
.xy-footbar__inner{ display:flex; max-width:var(--xy-wrap); margin:0 auto; }
.xy-footbar__btn{ flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; padding:10px; font-size:12px; color:var(--xy-ink-2); transition:all var(--xy-dur) var(--xy-ease); }
.xy-footbar__btn:hover{ color:var(--xy-clay); background:var(--xy-clay-soft); }
.xy-footbar__icon{ width:32px; height:32px; display:flex; align-items:center; justify-content:center; }
.xy-footbar__icon i{ font-size:20px; color:var(--xy-green); }
.xy-footbar__btn:hover .xy-footbar__icon i{ color:var(--xy-clay); }

/* ---------- 弹窗 ---------- */
.xy-modal{ display:none; position:fixed; inset:0; z-index:var(--xy-z-modal); background:rgba(20,30,25,.6); align-items:center; justify-content:center; padding:20px; }
.xy-modal.is-show{ display:flex; }
.xy-modal__panel{ position:relative; width:100%; max-width:360px; background:var(--xy-paper); border-radius:var(--xy-radius-lg); padding:32px 28px 26px; box-shadow:var(--xy-shadow-lg); animation:xyModalIn .3s var(--xy-ease); }
@keyframes xyModalIn{ from{ opacity:0; transform:translateY(20px) scale(.96); } to{ opacity:1; transform:none; } }
.xy-modal__close{ position:absolute; top:10px; right:16px; width:32px; height:32px; display:flex; align-items:center; justify-content:center; font-size:26px; color:var(--xy-ink-3); line-height:1; cursor:pointer; }
.xy-modal__close:hover{ color:var(--xy-clay); }
.xy-modal__title{ font-size:20px; font-weight:700; color:var(--xy-green); margin-bottom:18px; text-align:center; }
.xy-modal__body label{ display:block; font-size:13px; color:var(--xy-ink-3); margin-bottom:8px; }
.xy-modal__row{ display:flex; align-items:center; gap:10px; padding:14px 16px; background:var(--xy-cream); border:1px dashed var(--xy-line); border-radius:10px; }
.xy-modal__text{ flex:1; font-size:18px; font-weight:700; color:var(--xy-ink); letter-spacing:1px; word-break:break-all; }
.xy-modal__copy{ padding:8px 16px; background:var(--xy-clay); color:#fff; border-radius:8px; font-size:13px; font-weight:600; transition:all var(--xy-dur) var(--xy-ease); }
.xy-modal__copy:hover{ background:var(--xy-clay-2); }
.xy-modal__tip{ margin-top:14px; font-size:12px; color:var(--xy-ink-3); text-align:center; }

/* ---------- 返回顶部 ---------- */
.xy-backtop{ position:fixed; right:18px; bottom:80px; width:42px; height:42px; display:flex; align-items:center; justify-content:center; background:var(--xy-green); color:#fff; border-radius:50%; box-shadow:var(--xy-shadow); opacity:0; visibility:hidden; transform:translateY(10px); transition:all var(--xy-dur) var(--xy-ease); z-index:var(--xy-z-footbar); cursor:pointer; }
.xy-backtop.is-show{ opacity:1; visibility:visible; transform:none; }
.xy-backtop:hover{ background:var(--xy-clay); transform:translateY(-2px); }

/* ---------- 移动端布局 ---------- */
@media screen and (max-width:768px){
  .xy-site-header{ display:none; }
  .xy-mheader{ display:block; position:sticky; top:0; z-index:var(--xy-z-header); background:var(--xy-paper); box-shadow:0 1px 0 var(--xy-line); }
  .xy-mheader__bar{ background:var(--xy-green); color:#fff; font-size:12px; text-align:center; padding:6px; }
  .xy-mheader__main{ display:flex; align-items:center; justify-content:space-between; height:56px; padding:0 14px; }
  .xy-mheader__logo{ font-size:18px; font-weight:800; color:var(--xy-green); }
  .xy-mheader__logo img{ max-height:36px; }
  .xy-mheader__btn{ width:36px; height:36px; display:flex; align-items:center; justify-content:center; color:var(--xy-green); background:transparent; }
  .xy-mnav{ display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--xy-paper); z-index:var(--xy-z-modal); padding:60px 20px 30px; overflow-y:auto; }
  .xy-mnav.is-open{ display:block; }
  .xy-mnav ul{ display:flex; flex-direction:column; gap:6px; }
  .xy-mnav li a{ display:block; padding:14px 16px; font-size:16px; color:var(--xy-ink); border-bottom:1px solid var(--xy-line); }
  .xy-mnav li.is-active a{ color:var(--xy-green); font-weight:700; }
  .xy-banner .swiper-slide{ aspect-ratio:640/300; }
  .xy-footer__grid{ grid-template-columns:1fr 1fr 1fr; gap:18px 12px; padding-bottom:24px; }
  .xy-footer__brand{ grid-column:1/-1; }
  .xy-footer__brand .xy-footer__desc{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .xy-footer__social{ margin-top:10px; }
  .xy-site-footer{ padding:32px 0 0; }
  .xy-footer__col h4{ font-size:13px; margin-bottom:8px; padding-bottom:5px; }
  .xy-footer__col h4::after{ width:18px; }
  .xy-footer__links li{ margin-bottom:5px; }
  .xy-footer__links a{ font-size:12px; }
  .xy-footer__bottom{ padding:14px 0 24px; font-size:12px; }
  .xy-footer__bottom p{ margin-bottom:3px; }
  .xy-backtop{ right:14px; bottom:88px; }
  .xy-footbar{ display:block; box-shadow:0 -4px 20px rgba(31,61,46,.12); }
  .xy-footbar__inner{ padding-bottom:env(safe-area-inset-bottom); }
}