/* =============================================================================
   AUTOKATO — DESIGN TOKENS  v2.0
   -----------------------------------------------------------------------------
   基准：BendPak / Hunter Engineering / Rotary 等国际汽保品牌的真实做法
   原则：产品是主角，页面只是容器。白底、高对比、大图、硬朗、信息密度高。

   v2 相对 v1 的关键修正（v1 被判定为「土」）：
     1. 从「全站深色」改为「白底为主，深色只做 Hero / 通栏 CTA / 页脚」
     2. 从「低饱和铜色」改为「高对比工业红 #D2232A」+ 钢蓝 #0057B8 作信息色
     3. 卡片去掉 1px 描边堆叠，改为白底 + 极浅阴影，靠留白与图片分隔
     4. 圆角压到 2–4px，硬朗化
     5. 网格 gutter 从 28px 收到 20px，提高信息密度（BendPak 的做法）
   ============================================================================= */

:root {

  /* ==========================================================================
     01. 承载面 SURFACES — 白底为主
     ========================================================================== */
  --ak-white:        #FFFFFF;   /* 主承载面，全站 75% */
  --ak-paper:        #F5F6F7;   /* 次级区块底（产品区、规格区） */
  --ak-paper-2:      #EDEFF1;   /* 图片底、凹陷区、表头 */
  --ak-paper-3:      #E2E6E9;   /* 分隔线加粗处 */

  /* 深色仅用于：Hero 遮罩 / 通栏 CTA / 页脚 / 顶部促销条 */
  --ak-ink:          #0F1113;   /* 深色面 + 主文字色 */
  --ak-ink-2:        #1B1F22;   /* 深色面二级 */
  --ak-ink-3:        #2A3034;   /* 深色描边 */

  /* ==========================================================================
     02. 品牌色 BRAND
     红 = 行动与强调（设备行业安全色惯例：BendPak/Hunter/Challenger 同路）
     蓝 = 信息与次级动作（Hunter 路线）
     ========================================================================== */
  --ak-red:          #D2232A;
  --ak-red-hover:    #A81A20;
  --ak-red-active:   #8C151A;
  --ak-red-soft:     #FCEBEB;

  --ak-blue:         #0057B8;
  --ak-blue-hover:   #004494;
  --ak-blue-soft:    #E6F1FB;

  /* 深色面上的红需要提亮一档才能保持对比 */
  --ak-red-on-dark:  #E8444A;

  /* ==========================================================================
     03. 文本 TEXT
     ========================================================================== */
  --ak-text:         #0F1113;   /* 标题、正文 */
  --ak-text-2:       #3D454B;   /* 正文次要 */
  --ak-text-3:       #6B747B;   /* 辅助说明 */
  --ak-text-4:       #98A1A8;   /* 占位、时间、装饰 */

  --ak-text-inv:     #FFFFFF;   /* 深色面主文字 */
  --ak-text-inv-2:   #C6CDD2;   /* 深色面次要 */
  --ak-text-inv-3:   #8C959C;   /* 深色面辅助 */

  /* ==========================================================================
     04. 分割线 BORDER — 浅灰细线，不用描边堆叠
     ========================================================================== */
  --ak-line:         #E2E6E9;
  --ak-line-2:       #CFD5D9;
  --ak-line-dark:    rgba(255, 255, 255, 0.16);
  --ak-line-dark-2:  rgba(255, 255, 255, 0.28);

  /* ==========================================================================
     05. 字体 FONT
     display = 厚重工业无衬线（标题、Hero、数字）
     sans    = 中文 UI 与正文
     mono    = 型号、规格、编号、日期
     ========================================================================== */
  --ak-font-display: "Archivo", "Helvetica Neue", "Arial Narrow", Arial, sans-serif;

  --ak-font-sans:    "Inter", system-ui, -apple-system, "Segoe UI",
                     "Helvetica Neue", Arial, sans-serif;

  --ak-font-mono:    "IBM Plex Mono", "JetBrains Mono", "SFMono-Regular",
                     "Menlo", "Consolas", monospace;

  /* ==========================================================================
     06. 字号与行高 TYPE SCALE
     BendPak/Hunter 的标题是「大、重、紧」，不是「细、轻、松」
     ========================================================================== */
  --ak-fs-hero:   clamp(2.25rem, 5.2vw, 4.25rem);  /* 36 → 68  Hero    */
  --ak-fs-h1:     clamp(1.875rem, 3.4vw, 2.75rem);  /* 30 → 44  页面标题 */
  --ak-fs-h2:     clamp(1.5rem, 2.5vw, 2.125rem);   /* 24 → 34  区块标题 */
  --ak-fs-h3:     clamp(1.125rem, 1.5vw, 1.375rem); /* 18 → 22  卡片标题 */
  --ak-fs-h4:     1.0625rem;                        /* 17       小标题   */
  --ak-fs-lead:   clamp(1.0625rem, 1.3vw, 1.25rem); /* 17 → 20  导语     */
  --ak-fs-body:   1rem;                             /* 16       正文     */
  --ak-fs-sm:     0.875rem;                         /* 14       辅助     */
  --ak-fs-xs:     0.8125rem;                        /* 13       说明     */
  --ak-fs-label:  0.75rem;                          /* 12       全大写标签 */
  --ak-fs-mono:   0.8125rem;                        /* 13       规格     */

  --ak-lh-hero:  1.04;
  --ak-lh-h1:    1.10;
  --ak-lh-h2:    1.18;
  --ak-lh-h3:    1.30;
  --ak-lh-body:  1.70;
  --ak-lh-tight: 1.45;

  --ak-fw-regular:  400;
  --ak-fw-medium:   500;
  --ak-fw-semibold: 600;
  --ak-fw-bold:     700;
  --ak-fw-black:    800;   /* Hero 与数据，BendPak 的重量感来源 */

  /* 字距：标题大幅收紧，全大写标签大幅放开 */
  --ak-ls-hero:   -0.030em;
  --ak-ls-h1:     -0.025em;
  --ak-ls-h2:     -0.020em;
  --ak-ls-h3:     -0.012em;
  --ak-ls-body:    0;
  --ak-ls-label:   0.12em;
  --ak-ls-mono:    0.02em;

  /* ==========================================================================
     07. 间距 SPACING — 4px 基准
     国际大牌的做法：章节之间留白大，网格内部密度高
     ========================================================================== */
  --ak-s-1:  0.25rem;   /* 4   */
  --ak-s-2:  0.50rem;   /* 8   */
  --ak-s-3:  0.75rem;   /* 12  */
  --ak-s-4:  1.00rem;   /* 16  */
  --ak-s-5:  1.25rem;   /* 20  */
  --ak-s-6:  1.50rem;   /* 24  */
  --ak-s-7:  2.00rem;   /* 32  */
  --ak-s-8:  2.50rem;   /* 40  */
  --ak-s-9:  3.00rem;   /* 48  */
  --ak-s-10: 4.00rem;   /* 64  */
  --ak-s-11: 5.00rem;   /* 80  */
  --ak-s-12: 6.00rem;   /* 96  */

  --ak-section-y:    clamp(3.5rem, 7vw, 7rem);   /* 章节留白 72–112 */
  --ak-section-y-sm: clamp(2.5rem, 4vw, 4rem);

  /* ==========================================================================
     08. 栅格 GRID — 宽容器 + 密网格
     ========================================================================== */
  --ak-container:  1400px;
  --ak-container-sm: 960px;
  --ak-gutter:     clamp(1.25rem, 3vw, 2.5rem);
  --ak-grid-gap:   20px;                  /* BendPak 的密度：不是留白，是紧密 */
  --ak-grid-gap-lg: 28px;
  --ak-max-text:   62ch;

  /* ==========================================================================
     09. 圆角 RADIUS — 硬朗，最多 4px
     ========================================================================== */
  --ak-r-0:  0;
  --ak-r-1:  2px;
  --ak-r-2:  3px;
  --ak-r-3:  4px;
  --ak-r-pill: 999px;

  /* ==========================================================================
     10. 阴影 SHADOW — 只在白底上用，极轻
     ========================================================================== */
  --ak-shadow-1: 0 1px 2px rgba(15, 17, 19, 0.05);
  --ak-shadow-2: 0 2px 8px rgba(15, 17, 19, 0.07);
  --ak-shadow-3: 0 8px 24px rgba(15, 17, 19, 0.10);
  --ak-scrim:    linear-gradient(0deg, rgba(10,12,14,0.86) 0%, rgba(10,12,14,0.30) 55%, rgba(10,12,14,0.06) 100%);

  /* ==========================================================================
     11. 动效 MOTION — 快、短、无弹跳
     ========================================================================== */
  --ak-ease:     cubic-bezier(0.20, 0.60, 0.30, 1);
  --ak-dur-1:    120ms;
  --ak-dur-2:    200ms;
  --ak-dur-3:    360ms;
  --ak-img-zoom: 1.05;

  /* ==========================================================================
     12. 层级 Z
     ========================================================================== */
  --ak-z-sticky: 100;
  --ak-z-header: 300;
  --ak-z-drawer: 400;

  /* ==========================================================================
     13. 组件尺寸
     ========================================================================== */
  --ak-header-h:         76px;
  --ak-header-h-mobile:  60px;
  --ak-topbar-h:         38px;
  --ak-btn-h:            46px;
  --ak-btn-h-lg:         52px;
  --ak-btn-h-sm:         36px;
  --ak-input-h:          46px;
  --ak-icon:             22px;
  --ak-icon-stroke:      1.5;
}

/* =============================================================================
   移动端微调：只收密度与留白，视觉语言不变
   ============================================================================= */
@media (max-width: 768px) {
  :root {
    --ak-header-h: 60px;
    --ak-grid-gap: 14px;
    --ak-section-y: 3rem;
    --ak-max-text: 44ch;
    --ak-lh-body: 1.68;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ak-dur-1: 0ms;
    --ak-dur-2: 0ms;
    --ak-dur-3: 0ms;
    --ak-img-zoom: 1;
  }
}

/* =============================================================================
   AUTOKATO — VISUAL OVERRIDE LAYER  v2.0
   -----------------------------------------------------------------------------
   纯视觉层覆盖：零 HTML 改动、零结构调整、零文案改动。
   基准：BendPak / Hunter Engineering / Rotary 的真实视觉语言。

   接入：在现有主题 CSS 之后引入 tokens.css → autokato-theme.css

   目录：
     §0  重置与基底       §7  产品参数表
     §1  排版             §8  深色通栏（数据 / CTA）
     §2  按钮与标签       §9  表单
     §3  顶部促销条       §10 内页组件
     §4  导航             §11 页脚
     §5  Hero             §12 动效与响应式
     §6  分类块与产品卡   §13 遗留系统适配映射
   ============================================================================= */

@import url("tokens.css");

/* =============================================================================
   §0 重置与基底
   ============================================================================= */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--ak-header-h) + 20px);
}

body {
  margin: 0;
  background: var(--ak-white);
  color: var(--ak-text);
  font-family: var(--ak-font-sans);
  font-size: var(--ak-fs-body);
  line-height: var(--ak-lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, svg, video, canvas { display: block; max-width: 100%; height: auto; }

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--ak-dur-2) var(--ak-ease),
              border-color var(--ak-dur-2) var(--ak-ease),
              background-color var(--ak-dur-2) var(--ak-ease);
}

button, input, select, textarea { font: inherit; color: inherit; }

::selection { background: var(--ak-red); color: #fff; }

:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(210, 35, 42, 0.28);
  border-radius: var(--ak-r-1);
}

* { scrollbar-width: thin; scrollbar-color: #C6CDD2 #F5F6F7; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--ak-paper); }
::-webkit-scrollbar-thumb {
  background: #C6CDD2; border: 3px solid var(--ak-paper);
  border-radius: var(--ak-r-pill);
}
::-webkit-scrollbar-thumb:hover { background: #A9B2B8; }

/* 图标：统一线宽、统一端点、统一取色 —— 全站图标视觉重量一致的关键 */
.ak-icon {
  width: var(--ak-icon); height: var(--ak-icon);
  flex: none; display: inline-block; vertical-align: middle;
  fill: none;
  stroke: currentColor;
  stroke-width: var(--ak-icon-stroke);
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ak-container {
  width: 100%; max-width: var(--ak-container);
  margin-inline: auto; padding-inline: var(--ak-gutter);
}
.ak-container--sm { max-width: var(--ak-container-sm); }

.ak-section { padding-block: var(--ak-section-y); }
.ak-section--sm { padding-block: var(--ak-section-y-sm); }
.ak-section--paper { background: var(--ak-paper); }
.ak-section--line { border-top: 1px solid var(--ak-line); }

/* =============================================================================
   §1 排版 — 大而重、收紧字距（BendPak / Hunter 的重量感）
   ============================================================================= */
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 var(--ak-s-4);
  font-family: var(--ak-font-display);
  font-weight: var(--ak-fw-bold);
  line-height: var(--ak-lh-h2);
  letter-spacing: var(--ak-ls-h2);
  color: var(--ak-text);
  text-wrap: balance;
}
h1, .ak-h1 { font-size: var(--ak-fs-h1); line-height: var(--ak-lh-h1); letter-spacing: var(--ak-ls-h1); }
h2, .ak-h2 { font-size: var(--ak-fs-h2); line-height: var(--ak-lh-h2); letter-spacing: var(--ak-ls-h2); }
h3, .ak-h3 { font-size: var(--ak-fs-h3); line-height: var(--ak-lh-h3); letter-spacing: var(--ak-ls-h3); }
h4, .ak-h4 { font-size: var(--ak-fs-h4); font-weight: var(--ak-fw-semibold); letter-spacing: -0.008em; }

p { margin: 0 0 var(--ak-s-4); max-width: var(--ak-max-text); }
p:last-child { margin-bottom: 0; }

.ak-lead {
  font-size: var(--ak-fs-lead);
  line-height: 1.6;
  color: var(--ak-text-2);
  font-weight: var(--ak-fw-regular);
}

/* 全大写小标签：加宽字距，红字（BendPak 的 promo bar 语言） */
.ak-label {
  display: inline-block;
  margin: 0 0 var(--ak-s-3);
  font-family: var(--ak-font-sans);
  font-size: var(--ak-fs-label);
  font-weight: var(--ak-fw-semibold);
  letter-spacing: var(--ak-ls-label);
  text-transform: uppercase;
  color: var(--ak-red);
}

.ak-head { margin-bottom: clamp(1.75rem, 3.5vw, 3rem); max-width: 62ch; }
.ak-head--center { margin-inline: auto; text-align: center; }
.ak-head h2 { margin-bottom: var(--ak-s-3); }

.ak-mono {
  font-family: var(--ak-font-mono);
  font-size: var(--ak-fs-mono);
  letter-spacing: var(--ak-ls-mono);
  font-weight: var(--ak-fw-medium);
}

.ak-red { color: var(--ak-red); }
.ak-muted { color: var(--ak-text-3); }

/* =============================================================================
   §2 按钮与标签
   ============================================================================= */
.ak-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--ak-s-2);
  height: var(--ak-btn-h); padding: 0 var(--ak-s-6);
  font-family: var(--ak-font-sans);
  font-size: var(--ak-fs-sm); font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.01em; white-space: nowrap; cursor: pointer;
  border: 1px solid transparent; border-radius: var(--ak-r-1);
  background: transparent; color: var(--ak-text);
  transition: background-color var(--ak-dur-2) var(--ak-ease),
              border-color var(--ak-dur-2) var(--ak-ease),
              color var(--ak-dur-2) var(--ak-ease);
}
.ak-btn:active { transform: translateY(1px); }
.ak-btn .ak-arrow { transition: transform var(--ak-dur-2) var(--ak-ease); }
.ak-btn:hover .ak-arrow { transform: translateX(4px); }

.ak-btn--primary { background: var(--ak-red); border-color: var(--ak-red); color: #fff; }
.ak-btn--primary:hover { background: var(--ak-red-hover); border-color: var(--ak-red-hover); }

.ak-btn--outline { border-color: var(--ak-line-2); color: var(--ak-text); }
.ak-btn--outline:hover { border-color: var(--ak-text); background: var(--ak-white); }

.ak-btn--ghost { color: var(--ak-red); padding-inline: 0; height: auto; }
.ak-btn--ghost:hover { color: var(--ak-red-hover); }

.ak-btn--lg { height: var(--ak-btn-h-lg); padding-inline: var(--ak-s-8); font-size: var(--ak-fs-body); }
.ak-btn--sm { height: var(--ak-btn-h-sm); padding-inline: var(--ak-s-4); font-size: var(--ak-fs-xs); }

/* 深色面上的按钮 */
.ak-on-dark .ak-btn--outline { border-color: var(--ak-line-dark-2); color: #fff; }
.ak-on-dark .ak-btn--outline:hover { border-color: #fff; background: rgba(255,255,255,0.08); }

/* 标签 */
.ak-tag {
  display: inline-flex; align-items: center;
  padding: 3px 8px;
  font-size: 11px; font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.08em; text-transform: uppercase;
  border-radius: var(--ak-r-1);
  background: var(--ak-paper-2); color: var(--ak-text-2);
}
.ak-tag--red { background: var(--ak-red); color: #fff; }
.ak-tag--blue { background: var(--ak-blue-soft); color: var(--ak-blue); }
.ak-tag--new { background: var(--ak-red); color: #fff; }

/* 箭头链接（BendPak 的 SEE MORE） */
.ak-more {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: var(--ak-fs-sm); font-weight: var(--ak-fw-semibold);
  color: var(--ak-red);
}
.ak-more .ak-arrow { transition: transform var(--ak-dur-2) var(--ak-ease); }
.ak-more:hover .ak-arrow { transform: translateX(4px); }
.ak-more:hover { color: var(--ak-red-hover); }

/* =============================================================================
   §3 顶部促销条（BendPak 的深色 promo bar）
   ============================================================================= */
.ak-topbar {
  background: var(--ak-ink);
  color: var(--ak-text-inv-2);
  font-size: 12px; letter-spacing: 0.06em;
}
.ak-topbar .ak-container {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--ak-s-5); min-height: var(--ak-topbar-h);
}
.ak-topbar__list { display: flex; gap: var(--ak-s-6); flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.ak-topbar__list li { display: inline-flex; align-items: center; gap: 6px; }
.ak-topbar a:hover { color: #fff; }
.ak-topbar .ak-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--ak-red); }

/* =============================================================================
   §4 导航 — 白底、发丝线、红色 CTA
   ============================================================================= */
.ak-header {
  position: sticky; top: 0; z-index: var(--ak-z-header);
  background: var(--ak-white);
  border-bottom: 1px solid var(--ak-line);
}
.ak-header .ak-container {
  display: flex; align-items: center; gap: clamp(1rem, 3vw, 2.5rem);
  min-height: var(--ak-header-h);
}
.ak-header.is-scrolled { box-shadow: var(--ak-shadow-1); }

.ak-logo { display: inline-flex; align-items: center; flex: none; }
.ak-logo img { height: 30px; width: auto; }

.ak-nav { display: flex; align-items: center; gap: clamp(0.75rem, 1.8vw, 1.75rem); margin: 0; padding: 0; list-style: none; margin-right: auto; }
.ak-nav > li { position: relative; }
.ak-nav > li > a {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 0.5rem 0;
  font-size: 15px; font-weight: var(--ak-fw-medium);
  color: var(--ak-text);
  white-space: nowrap; position: relative;
}
.ak-nav > li > a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: var(--ak-red);
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--ak-dur-2) var(--ak-ease);
}
.ak-nav > li > a:hover { color: var(--ak-red); }
.ak-nav > li > a:hover::after,
.ak-nav > li.is-active > a::after { transform: scaleX(1); }
.ak-nav > li.is-active > a { color: var(--ak-red); font-weight: var(--ak-fw-semibold); }

.ak-nav .ak-sub {
  position: absolute; top: 100%; left: -14px;
  min-width: 232px; margin: 0; padding: var(--ak-s-2) 0;
  list-style: none;
  background: var(--ak-white);
  border: 1px solid var(--ak-line);
  box-shadow: var(--ak-shadow-3);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity var(--ak-dur-2) var(--ak-ease),
              transform var(--ak-dur-2) var(--ak-ease), visibility var(--ak-dur-2);
}
.ak-nav li:hover > .ak-sub { opacity: 1; visibility: visible; transform: translateY(0); }
.ak-nav .ak-sub a { display: block; padding: 0.5rem 1.125rem; font-size: var(--ak-fs-sm); color: var(--ak-text-2); }
.ak-nav .ak-sub a:hover { color: var(--ak-red); background: var(--ak-paper); }

.ak-header__actions { display: flex; align-items: center; gap: var(--ak-s-3); flex: none; }

.ak-burger {
  display: none; width: 42px; height: 42px;
  align-items: center; justify-content: center;
  background: transparent; cursor: pointer;
  border: 1px solid var(--ak-line-2); border-radius: var(--ak-r-1);
  color: var(--ak-text);
}
.ak-burger span, .ak-burger span::before, .ak-burger span::after {
  display: block; width: 18px; height: 1.5px; background: currentColor;
  transition: transform var(--ak-dur-2) var(--ak-ease), opacity var(--ak-dur-2);
}
.ak-burger span { position: relative; }
.ak-burger span::before { content: ""; position: absolute; top: -6px; }
.ak-burger span::after { content: ""; position: absolute; top: 6px; }
.ak-burger.is-open span { background: transparent; }
.ak-burger.is-open span::before { transform: translateY(6px) rotate(45deg); }
.ak-burger.is-open span::after { transform: translateY(-6px) rotate(-45deg); }

/* =============================================================================
   §5 Hero — 深色满幅 + 线稿背纹 + 白色大标题 + 红色 CTA
   ============================================================================= */
.ak-hero {
  position: relative; overflow: hidden;
  background: var(--ak-ink-2);
  color: var(--ak-text-inv);
}
.ak-hero::before { content: ""; position: absolute; inset: 0; background: var(--ak-scrim); z-index: 1; }
.ak-hero__art {
  position: absolute; right: -2%; bottom: -6%;
  width: min(58%, 760px); opacity: 0.14; z-index: 0;
  pointer-events: none; user-select: none;
}
.ak-hero__inner {
  position: relative; z-index: 2;
  padding-block: clamp(3.5rem, 9vw, 8rem);
  max-width: 780px;
}
.ak-hero__rule { width: 64px; height: 4px; background: var(--ak-red); margin-bottom: var(--ak-s-6); }
.ak-hero h1 {
  font-size: var(--ak-fs-hero);
  line-height: var(--ak-lh-hero);
  letter-spacing: var(--ak-ls-hero);
  font-weight: var(--ak-fw-black);
  color: #fff;
  margin-bottom: var(--ak-s-5);
}
.ak-hero__lead {
  font-size: var(--ak-fs-lead); line-height: 1.6;
  color: var(--ak-text-inv-2); max-width: 54ch;
  margin-bottom: var(--ak-s-7);
}
.ak-hero__cta { display: flex; flex-wrap: wrap; gap: var(--ak-s-3); }
.ak-hero__facts {
  position: relative; z-index: 2;
  display: flex; flex-wrap: wrap; gap: clamp(1.5rem, 4vw, 3.5rem);
  padding-block: var(--ak-s-5);
  border-top: 1px solid var(--ak-line-dark);
}
.ak-hero__fact b {
  display: block;
  font-family: var(--ak-font-display);
  font-size: 1.375rem; font-weight: var(--ak-fw-black);
  letter-spacing: -0.02em; color: #fff;
}
.ak-hero__fact span {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ak-text-inv-3);
}

/* =============================================================================
   §6 分类块与产品卡
   ============================================================================= */

/* 分类块：BendPak 风格 —— 方图 + 加粗标题 + SEE MORE，无卡片边框 */
.ak-cat { display: block; }
.ak-cat__media {
  position: relative; overflow: hidden;
  aspect-ratio: 1 / 1;
  background: var(--ak-paper-2);
  margin-bottom: var(--ak-s-3);
}
.ak-cat__media img {
  width: 100%; height: 100%; object-fit: cover;
  transform: scale(0.94);
  transition: transform var(--ak-dur-3) var(--ak-ease);
}
.ak-cat:hover .ak-cat__media img { transform: scale(1); }
.ak-cat__title {
  margin: 0 0 6px;
  font-family: var(--ak-font-display);
  font-size: var(--ak-fs-h4); font-weight: var(--ak-fw-bold);
  letter-spacing: -0.012em; color: var(--ak-text);
}
.ak-cat:hover .ak-cat__title { color: var(--ak-red); }
.ak-cat__desc { margin: 0 0 var(--ak-s-2); font-size: var(--ak-fs-sm); color: var(--ak-text-3); line-height: var(--ak-lh-tight); }

/* 产品卡：白底 + 发丝边 + 4:3 图 + 等宽型号 */
.ak-prod {
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--ak-white);
  border: 1px solid var(--ak-line);
  transition: border-color var(--ak-dur-2) var(--ak-ease), box-shadow var(--ak-dur-2) var(--ak-ease);
}
.ak-prod:hover { border-color: var(--ak-line-2); box-shadow: var(--ak-shadow-2); }
.ak-prod__media {
  position: relative; overflow: hidden;
  aspect-ratio: 4 / 3;
  background: var(--ak-paper-2);
  border-bottom: 1px solid var(--ak-line);
}
.ak-prod__media img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--ak-dur-3) var(--ak-ease);
}
.ak-prod:hover .ak-prod__media img { transform: scale(var(--ak-img-zoom)); }
.ak-prod__flag {
  position: absolute; top: 0; left: 0; z-index: 2;
  padding: 4px 10px;
  font-size: 11px; font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.08em; text-transform: uppercase;
  background: var(--ak-red); color: #fff;
}
.ak-prod__body { padding: var(--ak-s-5); display: flex; flex-direction: column; gap: var(--ak-s-3); flex: 1; }
.ak-prod__model {
  font-family: var(--ak-font-mono); font-size: 12px;
  letter-spacing: var(--ak-ls-mono); color: var(--ak-red); font-weight: var(--ak-fw-medium);
}
.ak-prod__name {
  margin: 0; font-family: var(--ak-font-display);
  font-size: var(--ak-fs-h4); font-weight: var(--ak-fw-bold);
  letter-spacing: -0.012em; color: var(--ak-text); line-height: 1.3;
}
.ak-prod__specs { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.ak-prod__specs li {
  display: flex; justify-content: space-between; gap: var(--ak-s-3);
  font-size: var(--ak-fs-xs); color: var(--ak-text-3);
}
.ak-prod__specs b {
  font-family: var(--ak-font-mono); font-size: var(--ak-fs-xs);
  font-weight: var(--ak-fw-medium); color: var(--ak-text);
}
.ak-prod__foot {
  margin-top: auto; padding-top: var(--ak-s-4);
  border-top: 1px solid var(--ak-line);
  display: flex; align-items: center; justify-content: space-between; gap: var(--ak-s-3);
}

/* 网格：密度高（BendPak 的做法） */
.ak-grid { display: grid; gap: var(--ak-grid-gap); }
.ak-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ak-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ak-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ak-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ak-grid--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.ak-split { display: grid; gap: clamp(2rem, 5vw, 4.5rem); grid-template-columns: 1fr 1fr; align-items: center; }
.ak-split--wide { grid-template-columns: 1.2fr 1fr; }
.ak-split--sidebar { grid-template-columns: 260px 1fr; align-items: start; }

/* =============================================================================
   §7 产品参数表 — 工业规格表是转化的核心，做成真正的数据表
   ============================================================================= */
.ak-spec { width: 100%; border-collapse: collapse; font-size: var(--ak-fs-sm); }
.ak-spec__cap {
  text-align: left; padding: var(--ak-s-3) var(--ak-s-4);
  background: var(--ak-ink); color: #fff;
  font-size: 12px; font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.12em; text-transform: uppercase;
}
.ak-spec th, .ak-spec td {
  padding: var(--ak-s-3) var(--ak-s-4);
  text-align: left; vertical-align: top;
  border-bottom: 1px solid var(--ak-line);
}
.ak-spec thead th {
  font-size: var(--ak-fs-xs); font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--ak-text-3);
  background: var(--ak-paper);
}
.ak-spec tbody th { font-weight: var(--ak-fw-regular); color: var(--ak-text-3); width: 42%; }
.ak-spec tbody td {
  font-family: var(--ak-font-mono); font-size: var(--ak-fs-mono);
  color: var(--ak-text);
}
.ak-spec tbody tr { transition: background-color var(--ak-dur-1) var(--ak-ease); }
.ak-spec tbody tr:hover { background: var(--ak-paper); }

/* =============================================================================
   §8 深色通栏（数据 / CTA）— 深色只出现在这里
   ============================================================================= */
.ak-band {
  position: relative; overflow: hidden;
  background: var(--ak-ink); color: var(--ak-text-inv);
}
.ak-band--red { background: var(--ak-red); }
.ak-stats { display: grid; gap: 1px; grid-template-columns: repeat(4, 1fr); background: var(--ak-line-dark); }
.ak-stat { background: var(--ak-ink); padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1rem, 2vw, 1.75rem); }
.ak-stat__num {
  display: block; margin-bottom: 6px;
  font-family: var(--ak-font-display);
  font-size: clamp(2.25rem, 4vw, 3.25rem);
  font-weight: var(--ak-fw-black);
  letter-spacing: -0.035em; line-height: 1;
  color: #fff;
}
.ak-stat__num em { font-style: normal; color: var(--ak-red-on-dark); }
.ak-stat__label {
  margin: 0; font-size: 11px; font-weight: var(--ak-fw-medium);
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--ak-text-inv-3);
}

/* 特性行：图标 + 标题 + 说明，无卡片，靠网格与留白分隔 */
.ak-feat { display: flex; gap: var(--ak-s-4); }
.ak-feat__icon {
  flex: none; width: 40px; height: 40px; display: grid; place-items: center;
  border: 1px solid var(--ak-line-2); color: var(--ak-red);
}
.ak-feat h3 { margin: 0 0 4px; font-size: var(--ak-fs-h4); font-weight: var(--ak-fw-bold); }
.ak-feat p { margin: 0; font-size: var(--ak-fs-sm); color: var(--ak-text-3); line-height: var(--ak-lh-tight); }

/* =============================================================================
   §9 表单
   ============================================================================= */
.ak-field { display: flex; flex-direction: column; gap: 6px; }
.ak-label-sm {
  font-size: 12px; font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--ak-text-3);
}
.ak-input, .ak-select, .ak-textarea {
  width: 100%; height: var(--ak-input-h); padding: 0 var(--ak-s-4);
  background: var(--ak-white); color: var(--ak-text);
  border: 1px solid var(--ak-line-2); border-radius: var(--ak-r-1);
  font-size: var(--ak-fs-sm);
  transition: border-color var(--ak-dur-2) var(--ak-ease), box-shadow var(--ak-dur-2) var(--ak-ease);
}
.ak-textarea { height: auto; min-height: 132px; padding: var(--ak-s-3) var(--ak-s-4); resize: vertical; line-height: 1.6; }
.ak-input::placeholder, .ak-textarea::placeholder { color: var(--ak-text-4); }
.ak-input:hover, .ak-select:hover, .ak-textarea:hover { border-color: var(--ak-text-4); }
.ak-input:focus, .ak-select:focus, .ak-textarea:focus {
  outline: none; border-color: var(--ak-red);
  box-shadow: 0 0 0 3px rgba(210, 35, 42, 0.14);
}
.ak-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%236B747B' stroke-width='1.5'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--ak-s-4) center;
  padding-right: var(--ak-s-8);
}

.ak-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ak-chip {
  padding: 7px 16px; font-size: var(--ak-fs-xs); font-weight: var(--ak-fw-medium);
  color: var(--ak-text-2); cursor: pointer; background: var(--ak-white);
  border: 1px solid var(--ak-line-2); border-radius: var(--ak-r-pill);
  transition: all var(--ak-dur-2) var(--ak-ease);
}
.ak-chip:hover { border-color: var(--ak-text-4); color: var(--ak-text); }
.ak-chip.is-active { background: var(--ak-ink); border-color: var(--ak-ink); color: #fff; }

/* =============================================================================
   §10 内页组件
   ============================================================================= */

/* 页头（内页） */
.ak-pagehead { background: var(--ak-paper); border-bottom: 1px solid var(--ak-line); padding-block: clamp(1.75rem, 3vw, 2.75rem); }
.ak-crumb { font-size: var(--ak-fs-xs); color: var(--ak-text-4); margin-bottom: var(--ak-s-3); }
.ak-crumb a { color: var(--ak-text-3); }
.ak-crumb a:hover { color: var(--ak-red); }

/* 图库 */
.ak-gallery { display: grid; gap: 12px; }
.ak-gallery__stage {
  aspect-ratio: 4 / 3; overflow: hidden;
  background: var(--ak-paper-2); border: 1px solid var(--ak-line);
  display: grid; place-items: center;
}
.ak-gallery__stage img { width: 100%; height: 100%; object-fit: cover; }
.ak-gallery__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.ak-gallery__thumb {
  aspect-ratio: 1 / 1; overflow: hidden; cursor: pointer; padding: 0;
  background: var(--ak-paper-2);
  border: 1px solid var(--ak-line);
  transition: border-color var(--ak-dur-2) var(--ak-ease);
}
.ak-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--ak-dur-3) var(--ak-ease); }
.ak-gallery__thumb:hover img { transform: scale(var(--ak-img-zoom)); }
.ak-gallery__thumb:hover { border-color: var(--ak-line-2); }
.ak-gallery__thumb.is-active { border-color: var(--ak-red); }

/* 下载行 */
.ak-dl {
  display: flex; align-items: center; gap: var(--ak-s-4);
  padding: var(--ak-s-4) var(--ak-s-5);
  background: var(--ak-white);
  border: 1px solid var(--ak-line);
  transition: border-color var(--ak-dur-2) var(--ak-ease), box-shadow var(--ak-dur-2) var(--ak-ease);
}
.ak-dl:hover { border-color: var(--ak-line-2); box-shadow: var(--ak-shadow-2); }
.ak-dl__ico { flex: none; width: 38px; height: 38px; display: grid; place-items: center; background: var(--ak-paper-2); color: var(--ak-red); }
.ak-dl span { display: flex; flex-direction: column; gap: 2px; }
.ak-dl b { font-size: var(--ak-fs-sm); font-weight: var(--ak-fw-semibold); color: var(--ak-text); }
.ak-dl em { font-style: normal; }

/* 时间轴 */
.ak-timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ak-s-6); }
.ak-timeline li { display: grid; grid-template-columns: 92px 1fr; gap: var(--ak-s-5); align-items: start; }
.ak-timeline time {
  font-family: var(--ak-font-mono); font-size: var(--ak-fs-sm);
  font-weight: var(--ak-fw-medium); color: var(--ak-red); padding-top: 3px;
}
.ak-timeline h3 { margin: 0 0 4px; font-size: var(--ak-fs-h4); font-weight: var(--ak-fw-bold); }
.ak-timeline p { margin: 0; font-size: var(--ak-fs-sm); color: var(--ak-text-3); }

/* 资讯卡 */
.ak-post { display: flex; flex-direction: column; overflow: hidden; background: var(--ak-white); border: 1px solid var(--ak-line); transition: border-color var(--ak-dur-2) var(--ak-ease), box-shadow var(--ak-dur-2) var(--ak-ease); }
.ak-post:hover { border-color: var(--ak-line-2); box-shadow: var(--ak-shadow-2); }
.ak-post__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--ak-paper-2); border-bottom: 1px solid var(--ak-line); }
.ak-post__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--ak-dur-3) var(--ak-ease); }
.ak-post:hover .ak-post__media img { transform: scale(var(--ak-img-zoom)); }
.ak-post__body { padding: var(--ak-s-5); display: flex; flex-direction: column; gap: var(--ak-s-3); flex: 1; }
.ak-post__meta { display: flex; align-items: center; gap: var(--ak-s-3); font-size: var(--ak-fs-xs); color: var(--ak-text-4); }
.ak-post__title { margin: 0; font-family: var(--ak-font-display); font-size: var(--ak-fs-h4); font-weight: var(--ak-fw-bold); letter-spacing: -0.012em; color: var(--ak-text); line-height: 1.35; }
.ak-post:hover .ak-post__title { color: var(--ak-red); }
.ak-post__excerpt { margin: 0; font-size: var(--ak-fs-sm); color: var(--ak-text-3); line-height: var(--ak-lh-tight); }
.ak-post__foot { margin-top: auto; padding-top: var(--ak-s-4); }
.ak-post--row { flex-direction: row; }
.ak-post--row .ak-post__media { flex: 0 0 46%; aspect-ratio: auto; border-bottom: 0; border-right: 1px solid var(--ak-line); }

/* 联系信息 */
.ak-info { display: flex; gap: var(--ak-s-4); padding: var(--ak-s-5); background: var(--ak-white); border: 1px solid var(--ak-line); }
.ak-info__ico { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--ak-line-2); color: var(--ak-red); }
.ak-info h3 { margin: 0 0 4px; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ak-text-3); font-weight: var(--ak-fw-semibold); font-family: var(--ak-font-sans); }
.ak-info p { margin: 0; font-size: var(--ak-fs-body); color: var(--ak-text); line-height: 1.6; }

.ak-map { min-height: 280px; background: var(--ak-paper-2); border: 1px solid var(--ak-line); position: relative; overflow: hidden; }

/* 分页 */
.ak-pager { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin-top: var(--ak-s-9); }
.ak-pager a, .ak-pager span {
  min-width: 40px; height: 40px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: var(--ak-fs-sm); font-weight: var(--ak-fw-medium);
  border: 1px solid var(--ak-line-2); color: var(--ak-text-2);
  transition: all var(--ak-dur-2) var(--ak-ease);
}
.ak-pager a:hover { border-color: var(--ak-ink); color: var(--ak-ink); }
.ak-pager .is-current { background: var(--ak-ink); border-color: var(--ak-ink); color: #fff; }
.ak-pager .is-disabled { opacity: 0.4; pointer-events: none; }

/* 返回顶部 */
.ak-totop {
  position: fixed; right: clamp(1rem, 2.5vw, 2rem); bottom: clamp(1rem, 2.5vw, 2rem);
  z-index: var(--ak-z-sticky);
  width: 44px; height: 44px; display: grid; place-items: center; cursor: pointer;
  background: var(--ak-ink); color: #fff; border: 0;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity var(--ak-dur-2) var(--ak-ease), transform var(--ak-dur-2) var(--ak-ease), visibility var(--ak-dur-2);
}
.ak-totop.is-visible { opacity: 1; visibility: visible; transform: none; }
.ak-totop:hover { background: var(--ak-red); }
.ak-totop svg { transform: rotate(-90deg); }

/* =============================================================================
   §11 页脚
   ============================================================================= */
.ak-footer {
  background: var(--ak-ink); color: var(--ak-text-inv-2);
  padding-block: clamp(2.5rem, 5vw, 4rem) var(--ak-s-6);
  font-size: var(--ak-fs-sm);
}
.ak-footer__grid {
  display: grid; gap: clamp(1.75rem, 4vw, 3rem);
  grid-template-columns: 1.6fr repeat(3, 1fr);
  padding-bottom: clamp(2rem, 4vw, 3rem);
  border-bottom: 1px solid var(--ak-line-dark);
}
.ak-footer h4 {
  margin-bottom: var(--ak-s-4);
  font-family: var(--ak-font-sans);
  font-size: 11px; font-weight: var(--ak-fw-semibold);
  letter-spacing: 0.14em; text-transform: uppercase; color: #fff;
}
.ak-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ak-footer a { color: var(--ak-text-inv-3); }
.ak-footer a:hover { color: #fff; }
.ak-footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--ak-s-4); padding-top: var(--ak-s-6);
  font-size: var(--ak-fs-xs); color: var(--ak-text-inv-3);
}

/* =============================================================================
   §12 动效与响应式
   ============================================================================= */
.ak-reveal {
  opacity: 0; transform: translateY(10px);
  transition: opacity var(--ak-dur-3) var(--ak-ease), transform var(--ak-dur-3) var(--ak-ease);
}
.ak-reveal.is-in { opacity: 1; transform: none; }

@media (max-width: 1280px) {
  .ak-grid--6 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ak-grid--5 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  .ak-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ak-grid--5, .ak-grid--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ak-split, .ak-split--wide, .ak-split--sidebar { grid-template-columns: 1fr; }
  .ak-stats { grid-template-columns: repeat(2, 1fr); }
  .ak-footer__grid { grid-template-columns: 1fr 1fr; }
  .ak-footer__grid > *:first-child { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  .ak-nav { display: none; }
  .ak-burger { display: inline-flex; }
  .ak-header__actions .ak-btn { display: none; }

  .ak-nav.is-open {
    display: flex; flex-direction: column; align-items: stretch; gap: 0;
    position: fixed; inset: var(--ak-header-h) 0 auto 0;
    max-height: calc(100dvh - var(--ak-header-h)); overflow-y: auto;
    padding: var(--ak-s-3) 0 var(--ak-s-6);
    background: var(--ak-white);
    border-bottom: 1px solid var(--ak-line);
    box-shadow: var(--ak-shadow-3);
  }
  .ak-nav.is-open > li { border-bottom: 1px solid var(--ak-line); }
  .ak-nav.is-open > li > a { padding: var(--ak-s-4) var(--ak-gutter); font-size: var(--ak-fs-body); }
  .ak-nav.is-open > li > a::after { display: none; }
  .ak-nav.is-open .ak-sub {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0; background: transparent; padding: 0 0 var(--ak-s-3); min-width: 0;
  }
  .ak-nav.is-open .ak-sub a { padding: 0.5rem var(--ak-gutter) 0.5rem calc(var(--ak-gutter) + 14px); }

  .ak-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ak-post--row { flex-direction: column; }
  .ak-post--row .ak-post__media { flex: none; aspect-ratio: 16 / 10; border-right: 0; border-bottom: 1px solid var(--ak-line); }
  .ak-timeline li { grid-template-columns: 1fr; gap: 4px; }
}

@media (max-width: 640px) {
  .ak-grid--2, .ak-grid--3, .ak-grid--4, .ak-grid--5, .ak-grid--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ak-topbar__list li:not(:first-child) { display: none; }
  .ak-footer__grid { grid-template-columns: 1fr 1fr; }
  .ak-hero__art { width: 100%; opacity: 0.08; }
}

@media (max-width: 560px) {
  .ak-f-row { grid-template-columns: 1fr !important; }
}

@media (max-width: 480px) {
  .ak-grid--3, .ak-grid--4, .ak-grid--5, .ak-grid--6 { grid-template-columns: 1fr 1fr; }
  .ak-split { gap: var(--ak-s-6); }
  .ak-post__body, .ak-prod__body { padding: var(--ak-s-4); }
}

/* =============================================================================
   §13 遗留系统适配选择器映射
   把你们站点的真实 class 追加到对应分组即可，无需动 HTML
   ============================================================================= */

/* WordPress */
.site-header, .main-header, #masthead { background: var(--ak-white) !important; border-bottom: 1px solid var(--ak-line) !important; }
.site-footer, .main-footer, #colophon { background: var(--ak-ink) !important; color: var(--ak-text-inv-2) !important; border-top: 0 !important; }
.widget-title, .footer-widget-title { font-size: 11px !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #fff !important; }
.entry-content p, .page-content p, .post-content p { line-height: var(--ak-lh-body); max-width: var(--ak-max-text); }
.entry-content img, .page-content img { border-radius: var(--ak-r-1); }
.wp-caption-text, .wp-block-image figcaption { font-size: var(--ak-fs-xs); color: var(--ak-text-4); padding-top: var(--ak-s-2); }

/* Bootstrap 3/4/5 */
.navbar { background: var(--ak-white) !important; border: 0 !important; border-bottom: 1px solid var(--ak-line) !important; }
.navbar-nav .nav-link { color: var(--ak-text) !important; font-size: 15px !important; font-weight: 500 !important; }
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active { color: var(--ak-red) !important; }
.dropdown-menu { background: var(--ak-white) !important; border: 1px solid var(--ak-line) !important; box-shadow: var(--ak-shadow-3) !important; border-radius: 0 !important; }
.dropdown-item { color: var(--ak-text-2) !important; font-size: var(--ak-fs-sm) !important; }
.dropdown-item:hover { background: var(--ak-paper) !important; color: var(--ak-red) !important; }
.btn { border-radius: var(--ak-r-1) !important; letter-spacing: 0.01em; }
.btn-primary { background: var(--ak-red) !important; border-color: var(--ak-red) !important; }
.btn-primary:hover { background: var(--ak-red-hover) !important; border-color: var(--ak-red-hover) !important; }
.card { background: var(--ak-white) !important; border: 1px solid var(--ak-line) !important; border-radius: 0 !important; box-shadow: none !important; }
.card-title { font-weight: 700 !important; letter-spacing: -0.012em; color: var(--ak-text) !important; }
.card-text { color: var(--ak-text-3) !important; font-size: var(--ak-fs-sm) !important; }
.table th, .table td { border-color: var(--ak-line) !important; }
.form-control, .form-select {
  background: var(--ak-white) !important; color: var(--ak-text) !important;
  border: 1px solid var(--ak-line-2) !important; border-radius: var(--ak-r-1) !important;
}
.form-control:focus { border-color: var(--ak-red) !important; box-shadow: 0 0 0 3px rgba(210,35,42,0.14) !important; }

/* Elementor */
.elementor-section { padding-block: var(--ak-section-y); }
.elementor-heading-title { letter-spacing: var(--ak-ls-h2); line-height: var(--ak-lh-h2); }
.elementor-button { border-radius: var(--ak-r-1) !important; font-weight: 600 !important; }
.elementor-widget-container p { line-height: var(--ak-lh-body); }

/* 通用兜底 */
main img, section img, article img { border-radius: var(--ak-r-1); }
main a:hover, section a:hover, article a:hover { color: var(--ak-red); }

/* =============================================================================
   §14 打印
   ============================================================================= */
@media print {
  body { background: #fff; color: #000; }
  .ak-header, .ak-footer, .ak-burger, .ak-totop { display: none !important; }
}


/* AUTOKATO full visual v3: live CMS bridge */
body.ak-full-v3{margin:0!important;background:var(--ak-white)!important;color:var(--ak-text-1)!important;font-family:Inter,"Segoe UI",Arial,sans-serif!important;letter-spacing:0!important}
body.ak-full-v3>*:not(#ak-site-v3):not(script):not(style):not(link){display:none!important}
#ak-site-v3{display:block!important;min-height:100vh;overflow:hidden;background:#fff}
#ak-site-v3 *{box-sizing:border-box;letter-spacing:0}
#ak-site-v3 img{display:block;max-width:100%}
#ak-site-v3 a{text-decoration:none}
#ak-site-v3 .ak-logo img{width:190px;height:31px;object-fit:contain}
#ak-site-v3 .ak-topbar__list:first-child li:first-child{font-weight:700;color:#fff}
#ak-site-v3 .ak-topbar__right{align-items:center;gap:18px}
#ak-site-v3 .ak-socials{display:flex;align-items:center;gap:4px;margin:0}
#ak-site-v3 .ak-socials a{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid rgba(255,255,255,.16);color:var(--ak-text-inv-2);font-size:14px;line-height:1;transition:color var(--ak-dur-2),background var(--ak-dur-2),border-color var(--ak-dur-2)}
#ak-site-v3 .ak-socials a:hover{border-color:var(--ak-red);background:var(--ak-red);color:#fff}
#ak-site-v3 .ak-socials svg{display:block;width:14px;height:14px;fill:currentColor}
#ak-site-v3 .ak-hero{min-height:min(760px,calc(100vh - var(--ak-topbar-h) - var(--ak-header-h)));background:#07101a}
#ak-site-v3 .ak-hero__art{inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.46;filter:saturate(.86) contrast(1.05)}
#ak-site-v3 .ak-hero::before{background:linear-gradient(90deg,rgba(5,11,18,.97) 0%,rgba(5,11,18,.84) 42%,rgba(5,11,18,.28) 78%,rgba(5,11,18,.16) 100%)}
#ak-site-v3 .ak-hero__inner{max-width:760px}
#ak-site-v3 .ak-hero h1{max-width:790px}
#ak-site-v3 .ak-hero .ak-btn--outline{border-color:#fff;color:#fff}
#ak-site-v3 .ak-hero__facts{grid-template-columns:repeat(4,minmax(0,1fr))}
#ak-site-v3 .ak-hero__fact{min-width:0}
#ak-site-v3 .ak-hero__fact b{overflow-wrap:anywhere}
#ak-site-v3 .ak-cat__media{background:#f4f6f7}
#ak-site-v3 .ak-cat__media img,#ak-site-v3 .ak-prod__media img{object-fit:contain}
#ak-site-v3 .ak-prod__media{aspect-ratio:1/1;background:#f6f7f8}
#ak-site-v3 .ak-prod__media img{width:100%;height:100%;padding:20px}
#ak-site-v3 .ak-prod__name{overflow-wrap:anywhere}
#ak-site-v3 .ak-real-photo{width:100%;height:100%;min-height:460px;object-fit:cover;background:var(--ak-paper-2)}
#ak-site-v3 .ak-process-list{display:grid;gap:1px;background:var(--ak-line)}
#ak-site-v3 .ak-process{display:grid;grid-template-columns:52px 1fr;gap:20px;padding:22px;background:#fff}
#ak-site-v3 .ak-process b{color:var(--ak-red);font-family:var(--ak-font-display);font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-process strong{display:block;margin-bottom:5px;font-family:var(--ak-font-display);font-size:var(--ak-fs-lg)}
#ak-site-v3 .ak-process p{margin:0;color:var(--ak-text-3);font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-pagehead{background:#07101a}
#ak-site-v3 .ak-pagehead h1{color:#fff;overflow-wrap:anywhere}
#ak-site-v3 .ak-pagehead .ak-lead{color:var(--ak-text-inv-3)}
#ak-site-v3 .ak-pagehead--compact{padding-block:22px}
#ak-site-v3 .ak-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;color:var(--ak-text-inv-3);font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-breadcrumbs a{color:#fff}
#ak-site-v3 .ak-breadcrumbs a:hover{color:var(--ak-red)}
#ak-site-v3 .ak-breadcrumbs b{color:var(--ak-text-inv-2);font-weight:600}
#ak-site-v3 .ak-list-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:42px;align-items:start}
#ak-site-v3 .ak-side{position:sticky;top:calc(var(--ak-header-h) + 20px);border-top:4px solid var(--ak-red);background:var(--ak-paper);padding:22px}
#ak-site-v3 .ak-side h2{font-size:var(--ak-fs-lg);margin:0 0 16px}
#ak-site-v3 .ak-side ul{list-style:none;margin:0;padding:0;display:grid;gap:1px}
#ak-site-v3 .ak-side a{display:block;padding:10px 0;border-bottom:1px solid var(--ak-line);color:var(--ak-text-2);font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-side a:hover{color:var(--ak-red)}
#ak-site-v3 .ak-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--ak-line)}
#ak-site-v3 .ak-toolbar p{margin:0;color:var(--ak-text-3);font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-news-card{display:flex;flex-direction:column;border:1px solid var(--ak-line);background:#fff;transition:border-color var(--ak-dur-2),transform var(--ak-dur-2)}
#ak-site-v3 .ak-news-card:hover{transform:translateY(-3px);border-color:var(--ak-line-2)}
#ak-site-v3 .ak-news-card__media{aspect-ratio:16/10;overflow:hidden;background:var(--ak-paper-2)}
#ak-site-v3 .ak-news-card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--ak-dur-3)}
#ak-site-v3 .ak-news-card:hover img{transform:scale(var(--ak-img-zoom))}
#ak-site-v3 .ak-news-card__body{padding:22px}
#ak-site-v3 .ak-news-card h2,#ak-site-v3 .ak-news-card h3{margin:9px 0 12px;font-size:var(--ak-fs-xl);line-height:1.22}
#ak-site-v3 .ak-news-card p{margin:0;color:var(--ak-text-3);font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-date{color:var(--ak-red);font-family:var(--ak-font-mono);font-size:var(--ak-fs-xs);text-transform:uppercase}
#ak-site-v3 .ak-product-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:clamp(30px,5vw,72px);align-items:start}
#ak-site-v3 .ak-gallery__stage{position:relative;aspect-ratio:1/1;background:#f5f6f7;cursor:zoom-in}
#ak-site-v3 .ak-gallery__stage img{object-fit:contain;padding:20px}
#ak-site-v3 .ak-gallery__thumb img{object-fit:contain;padding:7px;background:#f5f6f7}
#ak-site-v3 .ak-product-summary h1{font-size:clamp(2.25rem,4vw,4.35rem);line-height:.98}
#ak-site-v3 .ak-model{display:inline-block;margin-bottom:18px;color:var(--ak-red);font-family:var(--ak-font-mono);font-size:var(--ak-fs-sm);font-weight:700;text-transform:uppercase}
#ak-site-v3 .ak-meta-list{display:grid;gap:1px;margin:28px 0;background:var(--ak-line)}
#ak-site-v3 .ak-meta-row{display:flex;justify-content:space-between;gap:20px;padding:13px 15px;background:#fff;font-size:var(--ak-fs-sm)}
#ak-site-v3 .ak-meta-row span{color:var(--ak-text-3)}
#ak-site-v3 .ak-product-actions{display:flex;flex-wrap:wrap;gap:10px}
#ak-site-v3 .ak-rich{font-size:1rem;line-height:1.75;color:var(--ak-text-2)}
#ak-site-v3 .ak-rich>*:first-child{margin-top:0}
#ak-site-v3 .ak-rich h2{margin-top:2.3em;font-size:clamp(1.65rem,3vw,2.5rem)}
#ak-site-v3 .ak-rich h3{margin-top:1.8em;font-size:clamp(1.25rem,2vw,1.7rem)}
#ak-site-v3 .ak-rich img{height:auto;margin:24px auto}
#ak-site-v3 .ak-rich table{width:100%!important;border-collapse:collapse!important}
#ak-site-v3 .ak-rich td,#ak-site-v3 .ak-rich th{padding:12px!important;border:1px solid var(--ak-line)!important}
#ak-site-v3 .ak-rich iframe{max-width:100%}
#ak-site-v3 .ak-article-layout{display:grid;grid-template-columns:minmax(0,820px) 260px;gap:64px;align-items:start}
#ak-site-v3 .ak-article-layout .ak-side{top:calc(var(--ak-header-h) + 24px)}
#ak-site-v3 .ak-legacy-content>.ak-about-v3,#ak-site-v3 .ak-legacy-content>.autokato-about-v3,#ak-site-v3 .ak-legacy-content>.ak-contact-v1,#ak-site-v3 .ak-legacy-content>.ak-download-v1,#ak-site-v3 .ak-legacy-content>.ak-policy-v1{margin:0!important;width:100%!important;max-width:100%!important}
#ak-site-v3 .ak-about-v3,#ak-site-v3 .autokato-about-v3,#ak-site-v3 .ak-contact-v1,#ak-site-v3 .ak-download-v1,#ak-site-v3 .ak-policy-v1{--blue:var(--ak-red)!important;--blue2:var(--ak-red-hover)!important;--signal:var(--ak-red-on-dark)!important}
#ak-site-v3 .ak-about-v3 .ak3-dark a,#ak-site-v3 .autokato-about-v3 .ak3-dark a{color:var(--ak-red-on-dark)!important}
#ak-site-v3 .ak-lightbox{position:fixed;inset:0;z-index:9999;display:none;place-items:center;padding:30px;background:rgba(3,7,11,.92)}
#ak-site-v3 .ak-lightbox.is-open{display:grid}
#ak-site-v3 .ak-lightbox img{max-width:min(1200px,94vw);max-height:88vh;object-fit:contain;background:#fff}
#ak-site-v3 .ak-lightbox button{position:absolute;top:20px;right:20px;width:48px;height:48px;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;font-size:30px;cursor:pointer}
#ak-site-v3 .ak-footer__brand img{width:180px;height:32px;object-fit:cover;object-position:center;filter:invert(1);mix-blend-mode:screen}
#ak-site-v3 .ak-footer__brand p{max-width:420px;color:var(--ak-text-inv-3)}
#ak-site-v3 .ak-contact-list{display:grid;justify-items:start;gap:10px;color:var(--ak-text-inv-3);font-size:var(--ak-fs-sm);text-align:left!important}
#ak-site-v3 .ak-contact-list>a,#ak-site-v3 .ak-contact-list>span{float:none!important;justify-self:start!important;width:auto!important;margin:0!important;text-align:left!important}
#ak-site-v3 .ak-totop{border:0;cursor:pointer}
#ak-site-v3 nav.ak-pager{display:flex!important;width:fit-content!important;max-width:100%!important;align-items:center!important;justify-content:center!important;gap:6px!important;flex-wrap:wrap!important;margin:var(--ak-s-9) auto 0!important;padding:0!important}
#ak-site-v3 nav.ak-pager>a,#ak-site-v3 nav.ak-pager>span{flex:0 0 auto!important;width:auto!important;margin:0!important}
#ak-site-v3 nav.ak-breadcrumbs{display:flex!important;width:100%!important;max-width:100%!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;flex-wrap:wrap!important;margin:0!important;padding:0!important}
#ak-site-v3 nav.ak-breadcrumbs>a,#ak-site-v3 nav.ak-breadcrumbs>span,#ak-site-v3 nav.ak-breadcrumbs>b{flex:0 0 auto!important;width:auto!important;max-width:100%!important;margin:0!important;padding:0!important}
#ak-site-v3 .ak-reveal,#ak-site-v3 .ak3-reveal,#ak-site-v3 .ak3-step,#ak-site-v3 .akc-reveal,#ak-site-v3 .akd-reveal,#ak-site-v3 .akp-reveal{opacity:1!important;visibility:visible!important;transform:none!important}
@media(max-width:980px){#ak-site-v3 .ak-list-layout,#ak-site-v3 .ak-article-layout{grid-template-columns:1fr}#ak-site-v3 .ak-side{position:static}#ak-site-v3 .ak-product-hero{grid-template-columns:1fr}#ak-site-v3 .ak-hero__facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){#ak-site-v3 .ak-logo img{width:142px;height:24px}#ak-site-v3 .ak-topbar{display:block}#ak-site-v3 .ak-topbar .ak-container{justify-content:center;min-height:36px}#ak-site-v3 .ak-topbar>.ak-container>.ak-topbar__list:first-child{display:none}#ak-site-v3 .ak-topbar__right>li{display:none}#ak-site-v3 .ak-topbar__right>li:last-child{display:inline-flex}#ak-site-v3 .ak-socials a{width:30px;height:30px}#ak-site-v3 .ak-hero{min-height:690px}#ak-site-v3 .ak-hero__inner{padding-top:75px}#ak-site-v3 .ak-hero h1{font-size:clamp(2.35rem,12vw,3.4rem)}#ak-site-v3 .ak-hero__lead{font-size:1rem}#ak-site-v3 .ak-hero__cta,#ak-site-v3 .ak-hero__cta .ak-btn{width:100%}#ak-site-v3 .ak-hero__facts{grid-template-columns:1fr 1fr}#ak-site-v3 .ak-hero__fact{padding:16px 12px}#ak-site-v3 .ak-real-photo{min-height:300px}#ak-site-v3 .ak-product-summary h1{font-size:2.35rem}#ak-site-v3 .ak-gallery__thumbs{gap:7px}#ak-site-v3 .ak-pagehead{padding-block:45px}#ak-site-v3 .ak-toolbar{align-items:flex-start;flex-direction:column}#ak-site-v3 .ak-legacy-content>.ak-about-v3,#ak-site-v3 .ak-legacy-content>.ak-contact-v1,#ak-site-v3 .ak-legacy-content>.ak-download-v1,#ak-site-v3 .ak-legacy-content>.ak-policy-v1{overflow:hidden!important}#ak-site-v3 .ak-legacy-content>.ak-about-v3{margin-left:0!important}#ak-site-v3 .ak-legacy-content>.ak-contact-v1>section,#ak-site-v3 .ak-legacy-content>.ak-download-v1>section,#ak-site-v3 .ak-legacy-content>.ak-download-v1>main{width:100%!important;max-width:100%!important;margin-inline:0!important}#ak-site-v3 .ak-legacy-content .ak3-wrap,#ak-site-v3 .ak-legacy-content .akc-wrap,#ak-site-v3 .ak-legacy-content .akd-wrap{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;padding-left:14px!important;padding-right:14px!important}}