/* =============================================================
   AXUI · 云产品站设计系统  (Alibaba-Cloud Style)
   -------------------------------------------------------------
   纯 CSS，无编译依赖、无外部字体/CDN，PHP 5.6+ 环境直接引用即可。
   主色可改 :root 里的 --ax-primary 一处，全站生效。
   ============================================================= */

/* -------------------------------------------------------------
   ❗ 栅格兼容修正（必读）
   -------------------------------------------------------------
   模板自带的 style1/css/bootstrap.min.css 是 Bootstrap 3.3.7，
   但打包时把 @media (min-width:992px) 里那条

       .col-md-1 ... .col-md-12 的 float: left

   整条用块注释包起来了，只剩 width。
   sm(768) / lg(1200) 两档都是正常的 float，唯独 md 档缺失 ——
   而 md 档正是 992px 以上的桌面主战场。

   后果：所有 row + col-md-* 的两栏/多栏布局不会并排，
   而是各占一行竖排（购物车、订单、服务列表、首页都受影响）。

   这里按 Bootstrap 原义补回 md 档的 float。.row 的 clearfix
   （before 用 display:table / after 用 clear:both）在 bootstrap.min.css
   里是完好的，所以补 float 后不会出现高度塌陷。
   ------------------------------------------------------------- */
@media (min-width: 992px){
    .col-md-1,  .col-md-2,  .col-md-3,  .col-md-4,
    .col-md-5,  .col-md-6,  .col-md-7,  .col-md-8,
    .col-md-9,  .col-md-10, .col-md-11, .col-md-12{
        float: left;
    }
}

:root{
    /* 登录/注册页底部版权条的预留高度。
       版权条已嵌进 .ax-auth-hero 内部（绝对定位到底部），不再占用独立一行，
       所以这里是 0；英雄区直接占满整屏。 */
    --ax-auth-foot-h:    0px;

    /* 品牌色 —— 云蓝 */
    --ax-primary:        #1677ff;
    --ax-primary-dark:   #0958d9;
    --ax-primary-light:  #4096ff;
    --ax-primary-soft:   #eef4ff;
    --ax-primary-line:   #91caff;

    /* 辅助蓝（链接、信息、技术感） */
    --ax-blue:           #1677ff;
    --ax-blue-dark:      #0958d9;
    --ax-blue-soft:      #eef4ff;

    /* 中性色 */
    --ax-text:           #1d2129;
    --ax-text-2:         #4e5969;
    --ax-text-3:         #86909c;
    --ax-line:           #e5e6eb;
    --ax-line-soft:      #f0f1f3;
    --ax-bg:             #f7f9fc;
    --ax-bg-2:           #f2f3f5;
    --ax-surface:        #ffffff;
    --ax-success:        #00b42a;
    --ax-warning:        #ff7d00;
    --ax-danger:         #f53f3f;

    /* 形状 —— 尖锐方块风（不要圆润） */
    --ax-radius:         0px;
    --ax-radius-sm:      0px;
    --ax-radius-xs:      0px;
    --ax-shadow-sm:      0 2px 8px rgba(29,33,41,.06);
    --ax-shadow:         0 6px 20px rgba(29,33,41,.08);
    --ax-shadow-lg:      0 12px 34px rgba(29,33,41,.12);
    --ax-grad:           linear-gradient(135deg,#3c9bff 0%,#1677ff 100%);

    --ax-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
               "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- 基础 ---------- */
.ax-body,
body.ax-body{
    margin: 0;                 /* 清掉 UA 默认 8px 外边距，否则 100vh 页面会多出 16px 纵向滚动 */
    font-family: var(--ax-font);
    color: var(--ax-text);
    background: var(--ax-bg);
    font-size: 14px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.ax-body *,
.ax-body *::before,
.ax-body *::after{ box-sizing: border-box; }

.ax-body a{ color: var(--ax-text-2); text-decoration: none; transition: color .18s ease; }
.ax-body a:hover{ color: var(--ax-primary); }
.ax-body img{ max-width: 100%; height: auto; vertical-align: middle; }
.ax-body h1,.ax-body h2,.ax-body h3,.ax-body h4,.ax-body h5{ margin: 0; color: var(--ax-text); font-weight: 600; }
.ax-body p{ margin: 0; }
.ax-body ul{ margin: 0; padding: 0; list-style: none; }

/* ---------- 布局 ---------- */
.ax-container{ width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.ax-container--narrow{ max-width: 960px; }
.ax-row{ display: flex; flex-wrap: wrap; margin: 0 -12px; }
.ax-col{ padding: 0 12px; }
.ax-grid{ display: grid; gap: 20px; }
.ax-grid-2{ grid-template-columns: repeat(2,1fr); }
.ax-grid-3{ grid-template-columns: repeat(3,1fr); }
.ax-grid-4{ grid-template-columns: repeat(4,1fr); }
.ax-clear::after{ content:""; display: table; clear: both; }

/* ---------- 顶部导航 ---------- */
.ax-nav{
    position: sticky; top: 0; z-index: 1000;
    background: rgba(255,255,255,.92);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid var(--ax-line-soft);
    transition: box-shadow .2s ease;
}
.ax-nav.is-stuck{ box-shadow: 0 4px 18px rgba(29,33,41,.08); }
.ax-nav__inner{ display: flex; align-items: center; height: 64px; gap: 8px; }
.ax-nav__logo{ display: flex; align-items: center; gap: 10px; flex: 0 0 auto; margin-right: 18px; }
.ax-nav__logo img{ height: 38px; width: auto; display: block; }
.ax-nav__logo-text{ font-size: 19px; font-weight: 700; color: var(--ax-text); letter-spacing: .2px; white-space: nowrap; }
.ax-nav__menu{ display: flex; align-items: center; gap: 2px; flex: 1 1 auto; }
.ax-nav__link{
    position: relative; display: inline-flex; align-items: center; gap: 5px;
    height: 64px; padding: 0 14px; font-size: 14.5px; color: var(--ax-text-2);
    white-space: nowrap; border: 0; background: none; cursor: pointer;
}
.ax-nav__link:hover{ color: var(--ax-primary); }
.ax-nav__link.is-active{ color: var(--ax-primary); font-weight: 600; }
.ax-nav__link.is-active::after{
    content:""; position: absolute; left: 14px; right: 14px; bottom: 0; height: 2px;
    background: var(--ax-grad); border-radius: 2px;
}
.ax-nav__right{ display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.ax-nav__toggle{
    display: none; width: 40px; height: 40px; border-radius: 0; border: 1px solid var(--ax-line);
    background: #fff; cursor: pointer; color: var(--ax-text); font-size: 18px;
}
.ax-nav__toggle:hover{ border-color: var(--ax-primary); color: var(--ax-primary); }

/* 下拉 */
.ax-dd{ position: relative; }
.ax-dd__menu{
    position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(6px);
    min-width: 560px; background: #fff; border: 1px solid var(--ax-line);
    border-radius: var(--ax-radius); box-shadow: var(--ax-shadow-lg);
    padding: 16px; display: grid; grid-template-columns: repeat(3,1fr); gap: 6px 10px;
    opacity: 0; visibility: hidden; transition: all .18s ease;
}
.ax-dd:hover .ax-dd__menu{ opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.ax-dd__item{ display: block; padding: 9px 12px; border-radius: var(--ax-radius-xs); color: var(--ax-text-2); font-size: 14px; }
.ax-dd__item:hover{ background: var(--ax-primary-soft); color: var(--ax-primary); }
.ax-dd__item small{ display: block; color: var(--ax-text-3); font-size: 12px; margin-top: 2px; }

/* 移动端抽屉 */
.ax-mnav{
    position: fixed; inset: 0 0 0 auto; width: 82%; max-width: 340px; background: #fff;
    z-index: 1100; transform: translateX(100%); transition: transform .26s ease;
    box-shadow: -8px 0 30px rgba(0,0,0,.12); overflow-y: auto; padding: 18px;
}
.ax-mnav.is-open{ transform: translateX(0); }
.ax-mnav__mask{ position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 1090; opacity: 0; visibility: hidden; transition: .26s; }
.ax-mnav__mask.is-open{ opacity: 1; visibility: visible; }
.ax-mnav a{ display: block; padding: 12px 6px; border-bottom: 1px solid var(--ax-line-soft); color: var(--ax-text-2); font-size: 15px; }
.ax-mnav a:hover{ color: var(--ax-primary); }
.ax-mnav__title{ font-size: 12px; color: var(--ax-text-3); margin: 16px 6px 4px; letter-spacing: .08em; }

/* ---------- 按钮 ---------- */
.ax-btn{
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    height: 40px; padding: 0 20px; border-radius: var(--ax-radius-sm);
    font-size: 14px; font-weight: 500; line-height: 1; cursor: pointer;
    border: 1px solid transparent; background: #fff; color: var(--ax-text);
    transition: all .18s ease; white-space: nowrap; text-decoration: none;
}
.ax-btn--primary{ background: var(--ax-grad); color: #fff; box-shadow: 0 4px 12px rgba(22,119,255,.28); }
.ax-btn--primary:hover{ color:#fff; transform: translateY(-1px); box-shadow: 0 8px 20px rgba(22,119,255,.34); }
.ax-btn--blue{ background: var(--ax-blue); color: #fff; }
.ax-btn--blue:hover{ background: var(--ax-blue-dark); color: #fff; }
.ax-btn--ghost{ background: transparent; border-color: var(--ax-line); color: var(--ax-text-2); }
.ax-btn--ghost:hover{ border-color: var(--ax-primary); color: var(--ax-primary); background: var(--ax-primary-soft); }
.ax-btn--white{ background: #fff; color: var(--ax-text); box-shadow: var(--ax-shadow-sm); }
.ax-btn--white:hover{ color: var(--ax-primary); }
.ax-btn--outline-w{ background: transparent; border-color: rgba(255,255,255,.6); color: #fff; }
.ax-btn--outline-w:hover{ background: #fff; color: var(--ax-primary); }
.ax-btn--lg{ height: 48px; padding: 0 30px; font-size: 16px; border-radius: 0; }
.ax-btn--sm{ height: 32px; padding: 0 14px; font-size: 13px; }
.ax-btn--block{ width: 100%; }
.ax-btn--link{ background: none; color: var(--ax-blue); padding: 0; height: auto; }
.ax-btn:disabled,.ax-btn.is-disabled{ opacity:.55; cursor: not-allowed; transform:none !important; }

/* ---------- 卡片 ---------- */
.ax-card{
    background: var(--ax-surface); border: 1px solid var(--ax-line);
    border-radius: var(--ax-radius); padding: 24px; transition: all .22s ease;
}
.ax-card--hover:hover{ transform: translateY(-4px); box-shadow: var(--ax-shadow); border-color: var(--ax-primary-line); }
.ax-card__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom: 16px; }
.ax-card__title{ font-size: 16px; font-weight: 600; }
.ax-card__body{ color: var(--ax-text-2); }

/* 产品卡 */
.ax-pcard{ display:flex; flex-direction:column; height:100%; }
.ax-pcard__icon{
    width: 52px; height: 52px; border-radius: 0; display:flex; align-items:center; justify-content:center;
    background: var(--ax-primary-soft); color: var(--ax-primary); font-size: 24px; margin-bottom: 16px;
}
.ax-pcard__title{ font-size: 17px; font-weight: 600; margin-bottom: 8px; }
.ax-pcard__desc{ color: var(--ax-text-3); font-size: 13.5px; line-height: 1.7; flex: 1 1 auto; }
.ax-pcard__foot{ margin-top: 18px; display:flex; align-items:flex-end; justify-content:space-between; }
.ax-price{ color: var(--ax-primary); font-weight: 700; }
.ax-price b{ font-size: 26px; }
.ax-price small{ color: var(--ax-text-3); font-weight: 400; font-size: 12px; }

/* ---------- 区块 ---------- */
.ax-section{ padding: 76px 0; }
.ax-section--tight{ padding: 52px 0; }
.ax-section--gray{ background: var(--ax-bg); }
.ax-section--white{ background: #fff; }
.ax-head{ text-align: center; max-width: 720px; margin: 0 auto 46px; }
.ax-head h2{ font-size: 32px; line-height: 1.3; margin-bottom: 14px; }
.ax-head p{ color: var(--ax-text-3); font-size: 15.5px; }
.ax-head--left{ text-align: left; margin-left: 0; }

/* ---------- Hero ---------- */
.ax-hero{
    position: relative; overflow: hidden; color: #fff;
    background: radial-gradient(120% 120% at 80% 0%, #2b3a67 0%, #16203c 45%, #0b1226 100%);
    min-height: 560px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* ---------- Hero 轮播图（3 张背景图 · 纯 CSS 过渡 + 原生 JS 控制） ---------- */
.ax-hero__slides{ position: absolute; inset: 0; z-index: 0; }
.ax-hero__slide{
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    opacity: 0; transform: scale(1.06);
    transition: opacity 1.1s ease, transform 6.5s linear;
    will-change: opacity;
}
.ax-hero__slide.is-active{ opacity: 1; transform: scale(1); }
/* 图片未就绪时 slide 就是透明的，露出 .ax-hero 自身的深蓝渐变兜底 */
.ax-hero__shade{
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(90deg, rgba(9,18,38,.84) 0%, rgba(9,18,38,.58) 48%, rgba(9,18,38,.32) 100%);
}
/* 左右箭头 */
.ax-hero__arrow{
    position: absolute; top: 50%; z-index: 3;
    transform: translateY(-50%);
    width: 46px; height: 46px; border: 1px solid rgba(255,255,255,.35);
    background: rgba(10,18,38,.35); color: #fff; font-size: 18px; line-height: 1;
    cursor: pointer; transition: background .2s ease, border-color .2s ease;
    display: flex; align-items: center; justify-content: center;
    -webkit-user-select: none; user-select: none;
}
.ax-hero__arrow:hover{ background: var(--ax-primary); border-color: var(--ax-primary); }
.ax-hero__arrow--prev{ left: 22px; }
.ax-hero__arrow--next{ right: 22px; }
/* 底部指示点 */
.ax-hero__dots{
    position: absolute; left: 0; right: 0; bottom: 22px; z-index: 3;
    display: flex; justify-content: center; gap: 10px;
}
.ax-hero__dot{
    width: 34px; height: 4px; border: 0; padding: 0;
    background: rgba(255,255,255,.35); cursor: pointer;
    transition: background .25s ease, width .25s ease;
}
.ax-hero__dot:hover{ background: rgba(255,255,255,.65); }
.ax-hero__dot.is-active{ background: #fff; width: 46px; }
.ax-hero::before{
    content:""; position:absolute; inset:0;
    background-image:
        radial-gradient(circle at 15% 25%, rgba(22,119,255,.30), transparent 42%),
        radial-gradient(circle at 88% 78%, rgba(64,150,255,.24), transparent 46%);
    pointer-events:none;
}
.ax-hero::after{
    content:""; position:absolute; inset:0;
    background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 46px 46px;
    -webkit-mask-image: radial-gradient(ellipse at 60% 20%, #000 5%, transparent 70%);
            mask-image: radial-gradient(ellipse at 60% 20%, #000 5%, transparent 70%);
    pointer-events:none;
}
.ax-hero__inner{ position: relative; z-index: 2; padding: 96px 0 88px; }
.ax-hero__badge{
    display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius: 0;
    background: rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16);
    font-size: 13px; color: #dbe6ff; margin-bottom: 22px;
}
.ax-hero__badge i{ color: var(--ax-primary-light); }
.ax-hero h1{ color:#fff; font-size: 46px; line-height: 1.22; font-weight: 700; max-width: 760px; }
.ax-hero h1 em{ font-style: normal; background: linear-gradient(120deg,#7cc4ff,#1677ff); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.ax-hero__sub{ color:#b9c3da; font-size: 17px; margin-top: 20px; max-width: 640px; line-height: 1.75; }
.ax-hero__actions{ margin-top: 34px; display:flex; gap: 14px; flex-wrap: wrap; }
.ax-hero__meta{ margin-top: 40px; display:flex; gap: 40px; flex-wrap: wrap; }
.ax-hero__meta dt{ color:#fff; font-size: 26px; font-weight: 700; }
.ax-hero__meta dd{ color:#8f9cb8; font-size: 13px; }
.ax-hero__meta i{ color: var(--ax-primary-light); font-style: normal; }

/* 节点小卡（Hero 右侧） */
.ax-hero__aside{
    position: relative; z-index: 2; background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12); border-radius: 0; padding: 22px;
    backdrop-filter: blur(6px);
}
.ax-hero__aside h4{ color:#fff; font-size: 14px; margin-bottom: 14px; letter-spacing:.02em; }
.ax-node{
    display:flex; align-items:center; justify-content:space-between;
    padding: 11px 14px; border-radius: 0; background: rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08); margin-bottom: 10px;
}
.ax-node:last-child{ margin-bottom: 0; }
.ax-node b{ color:#fff; font-size: 14px; font-weight: 600; }
.ax-node span{ color:#8f9cb8; font-size: 12.5px; }
.ax-node .ax-dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background: var(--ax-success); margin-right: 8px; box-shadow: 0 0 0 4px rgba(0,180,42,.16); }

/* ---------- 特性 / 图标列表 ---------- */
.ax-feature{ text-align: left; }
.ax-feature__icon{
    width: 46px; height: 46px; border-radius: 0; display:flex; align-items:center; justify-content:center;
    font-size: 21px; background: var(--ax-blue-soft); color: var(--ax-blue); margin-bottom: 14px;
}
.ax-feature h4{ font-size: 16px; margin-bottom: 8px; }
.ax-feature p{ color: var(--ax-text-3); font-size: 13.5px; line-height: 1.7; }

/* ---------- 标签 / 徽章 ---------- */
.ax-tag{
    display:inline-flex; align-items:center; gap:5px; padding: 3px 10px; border-radius: 6px;
    font-size: 12px; background: var(--ax-bg-2); color: var(--ax-text-2);
}
.ax-tag--primary{ background: var(--ax-primary-soft); color: var(--ax-primary); }
.ax-tag--blue{ background: var(--ax-blue-soft); color: var(--ax-blue); }
.ax-tag--success{ background: #e8ffea; color: var(--ax-success); }
.ax-tag--danger{ background: #ffece8; color: var(--ax-danger); }
.ax-tag--warning{ background: #fff7e8; color: var(--ax-warning); }

/* ---------- 标签页 ---------- */
.ax-tabs{ display:flex; flex-wrap: wrap; gap: 8px; }
.ax-tab{
    padding: 9px 20px; border-radius: 0; font-size: 14px; color: var(--ax-text-2);
    background: #fff; border:1px solid var(--ax-line); cursor: pointer;
}
.ax-tab:hover{ color: var(--ax-primary); border-color: var(--ax-primary-line); }
.ax-tab.is-active{ background: var(--ax-grad); color:#fff; border-color: transparent; box-shadow: 0 4px 12px rgba(22,119,255,.25); }

/* ---------- 表单 ---------- */
.ax-body .ax-input,
.ax-body input.ax-input,
.ax-body textarea.ax-input,
.ax-body select.ax-input{
    width: 100%; height: 42px; padding: 0 14px; font-size: 14px; color: var(--ax-text);
    background: #fff; border: 1px solid var(--ax-line); border-radius: var(--ax-radius-sm);
    outline: none; transition: border-color .18s, box-shadow .18s;
}
.ax-body textarea.ax-input{ height: auto; padding: 12px 14px; line-height: 1.6; }
.ax-body .ax-input:focus{ border-color: var(--ax-primary); box-shadow: 0 0 0 3px rgba(22,119,255,.12); }
.ax-form-row{ margin-bottom: 18px; }
.ax-form-row > label{ display:block; font-size: 13px; color: var(--ax-text-2); margin-bottom: 7px; font-weight: 500; }

/* 新版表格 */
.ax-body table.ax-table{ width:100%; border-collapse: collapse; font-size: 13.5px; }
.ax-body table.ax-table th{ text-align:left; font-weight:600; color: var(--ax-text-2); background: var(--ax-bg); padding: 12px 14px; border-bottom:1px solid var(--ax-line); }
.ax-body table.ax-table td{ padding: 13px 14px; border-bottom:1px solid var(--ax-line-soft); color: var(--ax-text-2); }
.ax-body table.ax-table tr:hover td{ background: #fafbfc; }

/* 面板（兼容旧页面的 .panel） */
.ax-body .panel{ background:#fff; border:1px solid var(--ax-line); border-radius: var(--ax-radius); overflow:hidden; }
.ax-body .panel-heading{ padding: 13px 16px; border-bottom:1px solid var(--ax-line-soft); background:#fff; }
.ax-body .panel-title{ font-size:14px; color: var(--ax-text); margin:0; }
.ax-body .panel-body{ padding: 16px; color: var(--ax-text-2); }

/* ---------- 步骤 / 编号 ---------- */
.ax-steps{ display:grid; gap:20px; }
.ax-step{ display:flex; gap:16px; }
.ax-step__no{
    flex:0 0 auto; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    background: var(--ax-primary-soft); color: var(--ax-primary); font-weight:700; font-size:15px;
}
.ax-step h4{ font-size:15px; margin-bottom:4px; }
.ax-step p{ color: var(--ax-text-3); font-size:13.5px; }

/* ---------- 数据条 ---------- */
.ax-stats{ display:grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--ax-line); border-radius: var(--ax-radius); overflow:hidden; }
.ax-stat{ background:#fff; padding: 26px 20px; text-align:center; }
.ax-stat b{ display:block; font-size: 30px; color: var(--ax-primary); font-weight:700; }
.ax-stat span{ color: var(--ax-text-3); font-size: 13px; }

/* ---------- CTA 横幅 ---------- */
.ax-cta{
    border-radius: 0; padding: 52px 44px; text-align:center; color:#fff; position:relative; overflow:hidden;
    background: linear-gradient(120deg,#2f6fe0 0%,#1677ff 55%,#0958d9 100%);
    box-shadow: 0 18px 44px rgba(22,119,255,.28);
}
.ax-cta::after{ content:""; position:absolute; right:-40px; top:-40px; width:220px; height:220px; border-radius:50%; background:rgba(255,255,255,.12); }
.ax-cta h3{ color:#fff; font-size: 27px; margin-bottom: 10px; position:relative; z-index:2; }
.ax-cta p{ color: rgba(255,255,255,.9); font-size: 15px; position:relative; z-index:2; }
.ax-cta .ax-btn{ margin-top: 22px; position:relative; z-index:2; }

/* ---------- 页脚 ---------- */
.ax-footer{ background: #1b2030; color: #9aa3b8; padding: 58px 0 26px; }
.ax-footer a{ color: #9aa3b8; font-size: 13.5px; }
.ax-footer a:hover{ color: #fff; }
.ax-footer__grid{ display:grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 30px; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.08); }
.ax-footer__brand img{ height: 36px; margin-bottom: 16px; filter: brightness(0) invert(1); opacity:.92; }
.ax-footer__brand p{ font-size: 13.5px; line-height: 1.9; color:#8b93a8; }
.ax-footer__col h5{ color:#fff; font-size: 14.5px; margin-bottom: 16px; }
.ax-footer__col li{ margin-bottom: 10px; }
.ax-footer__bottom{ padding-top: 22px; display:flex; justify-content:space-between; flex-wrap: wrap; gap: 10px; font-size: 12.5px; color:#7b8398; }
.ax-footer__bottom a{ font-size: 12.5px; }

/* ---------- 通用工具 ---------- */
.ax-center{ text-align:center; }
.ax-mt-8{margin-top:8px}.ax-mt-16{margin-top:16px}.ax-mt-24{margin-top:24px}.ax-mt-40{margin-top:40px}
.ax-mb-16{margin-bottom:16px}.ax-mb-24{margin-bottom:24px}
.ax-flex{display:flex}.ax-items-center{align-items:center}.ax-justify-between{justify-content:space-between}
.ax-gap-12{gap:12px}.ax-gap-20{gap:20px}
.ax-text-2{color:var(--ax-text-2)}.ax-text-3{color:var(--ax-text-3)}.ax-primary{color:var(--ax-primary)}
.ax-hidden{display:none}

/* 徽标（列表页产品卡） */
.ax-plist{ display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.ax-plan__badge{ position:absolute; top:0; right:0; background:var(--ax-grad); color:#fff; font-size:11px; padding:3px 10px; border-radius:0; }

/* ---------- 通用折叠 / 手风琴 ---------- */
.ax-body .collapse{ display: none; }
.ax-body .collapse.is-open{ display: block; }
.ax-body .ax-faq__item{ transition: box-shadow .2s ease, border-color .2s ease; }
.ax-body .ax-faq__item:hover{ box-shadow: var(--ax-shadow); border-color: var(--ax-primary-line); }
.ax-body .ax-faq__q{ cursor: pointer; }
.ax-body .ax-faq__item.is-open .ax-faq__q i{ transform: rotate(180deg); }
.ax-body .ax-faq__q i{ transition: transform .2s ease; }
@media (prefers-reduced-motion: reduce){
    .ax-body .ax-faq__q i{ transition: none; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 1100px){
    .ax-grid-4{ grid-template-columns: repeat(2,1fr); }
    .ax-plist{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 900px){
    .ax-nav__menu{ display:none; }
    .ax-nav__toggle{ display:inline-flex; align-items:center; justify-content:center; }
    .ax-nav__right .ax-nav__hide-sm{ display:none; }
    .ax-hero{ min-height: 480px; }
    .ax-hero__arrow{ display: none; }
    .ax-hero h1{ font-size: 34px; }
    .ax-hero__inner{ padding: 64px 0 56px; }
    .ax-section{ padding: 52px 0; }
    .ax-head h2{ font-size: 25px; }
    .ax-footer__grid{ grid-template-columns: 1fr 1fr; }
    .ax-stats{ grid-template-columns: repeat(2,1fr); }
    .ax-grid-3{ grid-template-columns: 1fr; }
}
@media (max-width: 620px){
    .ax-grid-2{ grid-template-columns: 1fr; }
    .ax-plist{ grid-template-columns: 1fr; }
    .ax-hero{ min-height: 440px; }
    .ax-hero__dot{ width: 24px; }
    .ax-hero__dot.is-active{ width: 34px; }
    .ax-hero h1{ font-size: 28px; }
    .ax-hero__meta{ gap: 24px; }
    .ax-footer__grid{ grid-template-columns: 1fr; }
    .ax-cta{ padding: 36px 22px; }
    .ax-cta h3{ font-size: 22px; }
}

/* =============================================================
   首页专用
   ============================================================= */
.ix-a{ display:block; color:inherit; }
.ix-a:hover{ color:inherit; }
.ix-a .ax-pcard__title{ color: var(--ax-text); }
.ix-a:hover .ax-pcard__title{ color: var(--ax-primary); }
.ix-plan__name{ font-size:16px; font-weight:600; color: var(--ax-text); }
.ix-plan__line{ display:flex; justify-content:space-between; padding:8px 0; font-size:13.5px; color: var(--ax-text-2); border-bottom:1px dashed var(--ax-line-soft); }
.ix-plan__line:last-child{ border-bottom:0; }
.ix-node-card{ position:relative; overflow:hidden; }
.ix-node-card .flag{ font-size:30px; line-height:1; }
.ax-body dl{ margin:0; }
.ax-body dt,.ax-body dd{ margin:0; }

/* =============================================================
   图标字体（FontAwesome 4.7 + Simple Line Icons）
   -------------------------------------------------------------
   ⚠️ oneui.css 里这两个 @font-face 指向 style/font/ 目录 —— 该目录不存在，
   且文件名被打包工具改坏（fontawesome-webfont-4.7.01.woff2 之类），
   结果整个前台/会员中心的 fa 图标全部渲染成空白方块。
   这里用【真实存在的字体文件】重新声明一遍；本文件在 oneui.css 之后加载，
   同 family/weight/style 的 @font-face 后声明者生效，因此能覆盖坏的那份。
   字体文件在 style1/css/img/ 下（fontawesome-all.min.css 同目录约定）。
   ============================================================= */
@font-face{
    font-family: "FontAwesome";
    src: url("img/fontawesome-webfont.eot");
    src: url("img/fontawesome-webfont.eot?#iefix") format("embedded-opentype"),
         url("img/fontawesome-webfont.woff2") format("woff2"),
         url("img/fontawesome-webfont.woff") format("woff"),
         url("img/fontawesome-webfont.ttf") format("truetype"),
         url("img/fontawesome-webfont.svg#fontawesomeregular") format("svg");
    font-weight: normal; font-style: normal; font-display: block;
}
@font-face{
    font-family: "Simple-Line-Icons";
    src: url("img/Simple-Line-Icons.eot");
    src: url("img/Simple-Line-Icons.eot?#iefix") format("embedded-opentype"),
         url("img/Simple-Line-Icons.woff") format("woff"),
         url("img/Simple-Line-Icons.ttf") format("truetype"),
         url("img/Simple-Line-Icons.svg#Simple-Line-Icons") format("svg");
    font-weight: normal; font-style: normal; font-display: block;
}

/* =============================================================
   产品中心专用
   ============================================================= */
.buy-hero{ background: linear-gradient(120deg,#1b2540 0%,#22305a 60%,#2a3c6e 100%); color:#fff; padding:44px 0; }
.buy-hero h1{ color:#fff; font-size:28px; }
.buy-hero p{ color:#b9c3da; margin-top:10px; font-size:14.5px; }
.buy-cat-wrap{ background:#fff; border-bottom:1px solid var(--ax-line); position:sticky; top:64px; z-index:900; }
.buy-cat-wrap .ax-tabs{ padding:16px 0; overflow-x:auto; flex-wrap:nowrap; white-space:nowrap; }
.buy-card{ display:flex; flex-direction:column; }
.buy-card__name{ font-size:16.5px; font-weight:600; color: var(--ax-text); margin-bottom:10px; }
.buy-card__price{ display:flex; align-items:baseline; gap:4px; color: var(--ax-primary); font-weight:700; margin-bottom:14px; }
.buy-card__price b{ font-size:28px; }
.buy-card__price small{ color: var(--ax-text-3); font-weight:400; font-size:12.5px; }
.buy-card__desc{ color: var(--ax-text-2); font-size:13.5px; line-height:1.75; flex:1 1 auto; }
.buy-card__desc ul{ padding-left:0; }
.buy-card__desc li{ list-style:none; position:relative; padding-left:20px; margin-bottom:6px; }
.buy-card__desc li::before{ content:"\2022"; position:absolute; left:6px; color: var(--ax-primary); font-weight:700; }
.buy-empty{ text-align:center; padding:70px 0; color: var(--ax-text-3); }
.buy-empty i{ font-size:44px; color: var(--ax-line); display:block; margin-bottom:16px; }

/* 价格币种：Coin（替代 ￥） */
.buy-card__cur{ font-size:15px; font-weight:700; margin-right:3px; letter-spacing:.2px; }

/* ---------- 分类切换 · 轻动画 ---------- */
/* 顶部细进度条（绝对定位在分类条底部，随吸顶一起移动） */
.buy-bar{
    position:absolute; left:0; bottom:-1px; height:2px; width:100%;
    background: var(--ax-grad); border-radius:0;
    transform: scaleX(0); transform-origin: left center; opacity:0; pointer-events:none;
}

/* 列表切换时的柔化 */
.buy-list-wrap{ transition: opacity .26s ease, transform .26s ease; }
.buy-list-wrap.is-loading{ opacity:.25; transform: translateY(8px); pointer-events:none; }

/* 卡片逐张入场 */
@keyframes buyCardIn{
    from{ opacity:0; transform: translateY(16px) scale(.985); }
    to{ opacity:1; transform: none; }
}
.buy-list-wrap.is-enter .buy-card{ animation: buyCardIn .48s cubic-bezier(.22,.68,.35,1) both; }
.buy-list-wrap.is-enter .buy-empty{ animation: buyCardIn .42s ease both; }

/* 分类胶囊：切换手感 */
.buy-cat-wrap .ax-tab{
    transition: background .26s ease, color .26s ease, border-color .26s ease,
                box-shadow .26s ease, transform .16s ease;
}
.buy-cat-wrap .ax-tab:active{ transform: scale(.95); }
.buy-cat-wrap.is-loading .ax-tab{ opacity:.65; }
.buy-cat-wrap.is-loading .ax-tab.is-active{ opacity:1; }

/* 无障碍：尊重系统「减少动态效果」 */
@media (prefers-reduced-motion: reduce){
    .buy-list-wrap,
    .buy-list-wrap.is-loading{ opacity:1; transform:none; }
    .buy-list-wrap.is-enter .buy-card,
    .buy-list-wrap.is-enter .buy-empty{ animation:none; }
    .buy-bar{ display:none; }
}