/* ============================================================================
   SEA☆STAR 实益达 官网 — 样式系统 v2
   ----------------------------------------------------------------------------
   设计方向：白底 + 大图叙事 + 图片卡片网格（参照 oktlighting.com 布局语言）
   配色：品牌蓝，取色自官网原版 Logo 风车位图（实测主色 #0070C0）

   与 v1（暗中有光 · 暖琥珀金）的根本差异：
     · 页面底色 深色 → 白色；主色 暖琥珀金 → 品牌蓝
     · Hero 由「深色光锥 + 文字」→「满幅实景图 + 图上叠字」
     · 产品展示由「文字参数卡」→「图片卡片网格（直角、图上叠字）」
     · 光效体系（glow / beam-cone / halo）整体退役，改为克制阴影与细边框

   结构沿用 v1 的 class 命名，便于逐页平滑迁移。
   ============================================================================ */

/* ───────────────────────────  1. 设计令牌  ─────────────────────────── */
:root {
  /* ——— 品牌蓝（实测自 Logo 风车，主色 #0070C0）——— */
  --brand-900: #00305F;  --brand-800: #003D7A;  --brand-700: #0050A0;
  --brand-600: #0060B0;  --brand-500: #0070C0;  --brand-400: #0088CC;
  --brand-300: #0090D0;  --brand-200: #4FB3E8;  --brand-100: #B8DEFA;
  --brand-50:  #EAF4FC;  --brand-25:  #F5FAFE;

  /* ——— 中性灰阶 ——— */
  --neutral-0:   #FFFFFF;  --neutral-25:  #FCFCFD;  --neutral-50:  #F7F8FA;
  --neutral-100: #F1F3F5;  --neutral-200: #E4E7EB;  --neutral-300: #CFD4DB;
  --neutral-400: #9AA3AE;  --neutral-500: #6B7480;  --neutral-600: #4B535E;
  --neutral-700: #343A43;  --neutral-800: #22262D;  --neutral-900: #14171C;

  /* ——— 深色锚定区（CTA / 页脚）——— */
  --ink-950: #0B1015;  --ink-900: #0F1620;  --ink-800: #182231;  --ink-700: #22303F;

  /* ——— 语义色 ——— */
  --color-success: #0E9F6E;  --color-warning: #D97706;
  --color-danger:  #DC2626;  --color-info:    #2563EB;

  /* ——— 表面（白底体系）——— */
  --surface-bg: #FFFFFF;      --surface-alt: #F7F8FA;
  --surface-card: #FFFFFF;    --surface-sunken: #F1F3F5;
  --surface-dark: var(--ink-900);
  --border-subtle: #E4E7EB;   --border-strong: #CFD4DB;
  --border-brand: rgba(0,112,192,.35);

  /* ——— 文字 ——— */
  --text-primary: #14171C;    --text-secondary: #6B7480;
  --text-tertiary: #9AA3AE;   --text-brand: var(--brand-500);
  --text-brand-deep: var(--brand-700);
  --text-on-dark: #F1F3F5;    --text-on-dark-muted: #9AA3AE;

  /* ——— 字体 ——— */
  --font-heading: "Inter","Geist",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-body:    "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-mono:    "JetBrains Mono","IBM Plex Mono","SF Mono","Roboto Mono",ui-monospace,"Cascadia Code",monospace;

  /* ——— 间距 ——— */
  --space-2xs:4px;   --space-xs:8px;    --space-sm:12px;  --space-md:16px;
  --space-lg:24px;   --space-xl:32px;   --space-2xl:48px; --space-3xl:64px;
  --space-4xl:112px; --space-5xl:152px; --space-6xl:192px;

  /* ——— 圆角（图片直角，控件小圆角）——— */
  --radius-xs:2px; --radius-sm:4px;  --radius-md:6px;
  --radius-lg:10px; --radius-xl:16px; --radius-full:9999px;

  /* ——— 阴影（克制）——— */
  --shadow-raised:   0 1px 2px rgba(20,23,28,.05),0 1px 3px rgba(20,23,28,.04);
  --shadow-floating: 0 10px 30px rgba(20,23,28,.10),0 2px 8px rgba(20,23,28,.05);
  --shadow-overlay:  0 24px 60px rgba(11,16,21,.24);
  --shadow-hero:     0 30px 80px rgba(11,16,21,.35);

  /* ——— 动效 ——— */
  --ease-standard: cubic-bezier(.4,0,.2,1);
  --ease-out-soft: cubic-bezier(.16,1,.3,1);
  --duration-fast: 150ms;  --duration-base: 280ms;  --duration-slow: 600ms;

  /* ——— 布局 ——— */
  --container: 1340px;  --container-narrow: 860px;  --nav-h: 88px;
}

/* ───────────────────────────  2. 基础重置  ─────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--surface-bg); color:var(--text-primary);
  font-family:var(--font-body); font-size:16px; line-height:1.7;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img,svg,svg *{ max-width:100%; }
img{ display:block; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
h1,h2,h3,h4,h5,p,figure,blockquote{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
:focus-visible{ outline:2px solid var(--brand-500); outline-offset:3px; }
::selection{ background:var(--brand-100); color:var(--brand-900); }

/* ───────────────────────────  3. 版式  ─────────────────────────── */
.display-xl{ font-family:var(--font-heading); font-size:clamp(2.8rem,6.2vw,5.4rem); font-weight:600; line-height:1.02; letter-spacing:-.035em; }
.display{ font-family:var(--font-heading); font-size:clamp(2.15rem,4.8vw,3.8rem); font-weight:600; line-height:1.08; letter-spacing:-.03em; }
.h1{ font-family:var(--font-heading); font-size:clamp(2rem,3.8vw,2.9rem); font-weight:600; line-height:1.14; letter-spacing:-.025em; }
.h2{ font-family:var(--font-heading); font-size:clamp(1.75rem,3.2vw,2.6rem); font-weight:600; line-height:1.16; letter-spacing:-.024em; }
.h3{ font-family:var(--font-heading); font-size:clamp(1.3rem,2.2vw,1.7rem); font-weight:600; line-height:1.28; letter-spacing:-.016em; }
.h4{ font-family:var(--font-heading); font-size:1.0625rem; font-weight:600; line-height:1.4; letter-spacing:-.005em; }
.body-l{ font-size:1.1875rem; line-height:1.8; }
.body-s{ font-size:.9375rem; line-height:1.65; }
.small{ font-size:.8125rem; line-height:1.6; color:var(--text-secondary); }
.micro{ font-size:.6875rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.mono{ font-family:var(--font-mono); font-variant-numeric:tabular-nums; }
.overline{
  display:inline-block; font-family:var(--font-mono);
  font-size:.6875rem; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; color:var(--brand-500);
}

/* ─────────────  3b. 品牌图形层（取自 Logo 的视觉基因）─────────────
   Logo 实测特征 → 设计语言：
     · 8 片楔形叶片、顺时针旋转动感      → 放射装饰、旋转动效
     · 中心四角星负空间                  → 星形符号（章节标、列表项、分隔）
     · 叶片间细缝、锐利直线边缘          → 斜切角、硬边，不用大圆角
     · 单一青蓝色相(H197–209°) + 明度层次 → 只用明度表达层次，不引入第二色相
   ─────────────────────────────────────────────────────────── */

/* 星形符号（对应 Logo 中心的四角星负空间） */
.brand-star{
  display:inline-block; width:1em; height:1em; flex-shrink:0;
  background:currentColor; vertical-align:-.1em;
  clip-path:polygon(50% 0%,56% 35%,100% 50%,56% 65%,50% 100%,44% 65%,0% 50%,44% 35%);
}
/* 章节标（overline）自动带星形前缀 —— 全站无需改 HTML */
.overline::before{
  content:""; display:inline-block;
  width:.72em; height:.72em; margin-right:.7em;
  background:currentColor; vertical-align:.02em;
  clip-path:polygon(50% 0%,56% 35%,100% 50%,56% 65%,50% 100%,44% 65%,0% 50%,44% 35%);
}
/* 放射图形（对应 8 片叶片的旋转对称） */
.brand-burst{
  display:inline-block; width:1em; height:1em; flex-shrink:0;
  background:currentColor; opacity:.9;
  clip-path:polygon(
    50% 0%, 56% 40%, 100% 50%, 56% 60%, 50% 100%, 44% 60%, 0% 50%, 44% 40%,
    50% 8%, 52% 44%, 92% 50%, 52% 56%, 50% 92%, 48% 56%, 8% 50%, 48% 44%);
}
/* 楔形（对应单叶片）—— 用于列表项符号 / 装饰 */
.brand-wedge{
  display:inline-block; width:.62em; height:.62em; flex-shrink:0;
  background:currentColor;
  clip-path:polygon(0% 100%, 0% 8%, 100% 100%);   /* 直角楔形，呼应叶片锐边 */
}

/* 条款列表：用楔形替代圆点 */
.brand-list{ display:flex; flex-direction:column; gap:11px; }
.brand-list li{
  display:flex; align-items:flex-start; gap:11px;
  font-size:.9375rem; line-height:1.65;
}
.brand-list li::before{
  content:""; flex-shrink:0; margin-top:.52em;
  width:.54em; height:.54em; background:var(--brand-500);
  clip-path:polygon(0% 100%, 0% 10%, 100% 100%);
}
.dark .brand-list li::before{ background:var(--brand-200); }

/* 45° 装饰分隔线（呼应叶片的斜边） */
.brand-rule{
  height:1px; border:0; position:relative;
  background:linear-gradient(90deg,var(--brand-500) 0%,var(--brand-200) 22%,var(--border-subtle) 22%,var(--border-subtle) 100%);
}
.brand-rule::before{
  content:""; position:absolute; left:0; top:-3px;
  width:7px; height:7px; background:var(--brand-500);
  clip-path:polygon(50% 0%,56% 35%,100% 50%,56% 65%,50% 100%,44% 65%,0% 50%,44% 35%);
}

/* 斜切角（呼应叶片的锐利斜边）—— 用于图片卡 / 徽标容器 */
.brand-bevel{
  clip-path:polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.brand-bevel--sm{
  clip-path:polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}

/* 品牌旋转动效（对应风车的旋转本性） */
@keyframes brand-spin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
.brand-spin{ animation:brand-spin 26s linear infinite; }
.nav__logo:hover .brand-img{ transform:rotate(8deg); }
.brand-img{ transition:transform var(--duration-base) var(--ease-out-soft); }
@media (prefers-reduced-motion:reduce){
  .brand-spin{ animation:none; }
  .nav__logo:hover .brand-img{ transform:none; }
}

/* 深色区块统一品牌放射纹（呼应 Logo 的 8 叶旋转结构，45° 周期） */
.footer, .tech-band{ position:relative; }
.footer::before, .tech-band::before{
  content:""; position:absolute; inset:-28%; pointer-events:none; z-index:0;
  opacity:.05;
  background:repeating-conic-gradient(from 0deg at 50% 42%,
    rgba(255,255,255,.95) 0deg 22.5deg, transparent 22.5deg 45deg);
}
.footer > .container, .tech-band > .container{ position:relative; z-index:1; }

/* 首页实力带的数字：底部加品牌楔形装饰 */
.stat{ position:relative; }
.stat::after{
  content:""; position:absolute; left:0; bottom:-10px;
  width:26px; height:2px; background:var(--brand-400);
}
.dark .stat::after{ background:var(--brand-200); }
.accent-word{ color:var(--brand-500); }
.num{ font-family:var(--font-mono); font-variant-numeric:tabular-nums; }
.unit{ font-family:var(--font-mono); font-size:.8em; color:var(--text-tertiary); margin-left:2px; }
.measure{ max-width:58ch; }
.measure-lg{ max-width:72ch; }
.text-secondary{ color:var(--text-secondary); }
.text-tertiary{ color:var(--text-tertiary); }

/* ───────────────────────────  4. 布局与工具类  ─────────────────────────── */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(20px,4vw,40px); }
.container-narrow{ width:100%; max-width:var(--container-narrow); margin-inline:auto; padding-inline:clamp(20px,4vw,40px); }
.section{ padding-block:var(--space-4xl); }
.section-lg{ padding-block:var(--space-5xl); }
.section-tight{ padding-block:var(--space-3xl); }
.section-head{ max-width:760px; }
.divider{ height:1px; background:var(--border-subtle); border:0; }

.grid{ display:grid; gap:var(--space-lg); }
.grid-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.flex{ display:flex; }
.items-center{ align-items:center; }
.items-start{ align-items:flex-start; }
.justify-between{ justify-content:space-between; }
.justify-center{ justify-content:center; }
.center{ text-align:center; }
.relative{ position:relative; }
.hidden{ display:none !important; }
.mx-auto{ margin-inline:auto; }
.mt-0{margin-top:0;} .mt-sm{margin-top:var(--space-sm);} .mt-md{margin-top:var(--space-md);}
.mt-lg{margin-top:var(--space-lg);} .mt-xl{margin-top:var(--space-xl);} .mt-2xl{margin-top:var(--space-2xl);}
.mt-3xl{margin-top:var(--space-3xl);} .mt-4xl{margin-top:var(--space-4xl);}
.mb-md{margin-bottom:var(--space-md);}
.gap-xs{gap:var(--space-xs);} .gap-sm{gap:var(--space-sm);} .gap-md{gap:var(--space-md);}
.gap-lg{gap:var(--space-lg);} .gap-xl{gap:var(--space-xl);}
.stack-sm>*+*{ margin-top:var(--space-sm); }
.stack-md>*+*{ margin-top:var(--space-md); }
.stack-lg>*+*{ margin-top:var(--space-lg); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* 深色区块 */
.dark{ background:var(--ink-900); color:var(--text-on-dark); }
.dark .text-secondary{ color:var(--text-on-dark-muted); }
.dark .text-tertiary{ color:#5E6B7A; }
.dark .overline{ color:var(--brand-200); }
.dark .divider{ background:var(--ink-700); }
.darker{ background:var(--ink-950); }
.dark .link-arrow{ color:var(--brand-200); }

/* ───────────────────────────  5. 按钮  ─────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-xs);
  font-family:var(--font-body); font-size:.9375rem; font-weight:600;
  letter-spacing:.005em; white-space:nowrap;
  border-radius:var(--radius-md); border:1px solid transparent;
  padding:0 26px; height:48px;
  transition:background var(--duration-fast) var(--ease-standard),
             color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-standard),
             transform var(--duration-fast) var(--ease-standard);
}
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }
/* 按钮内的图标必须显式定尺寸：内联 <svg> 只给 viewBox 时默认尺寸极大，
   在 flex 容器里会被拉成巨型图形、盖住整块内容（联系页曾实测踩到）。 */
.btn svg{ width:17px; height:17px; flex-shrink:0; }
.btn--sm{ height:38px; padding:0 18px; font-size:.875rem; }
.btn--lg{ height:54px; padding:0 34px; font-size:1rem; }

.btn--primary{ background:var(--brand-500); color:#fff; box-shadow:var(--shadow-raised); }
.btn--primary:hover{ background:var(--brand-600); box-shadow:var(--shadow-floating); }
.btn--primary:active{ background:var(--brand-700); }

.btn--secondary{ background:#fff; color:var(--text-primary); border-color:var(--border-strong); }
.btn--secondary:hover{ border-color:var(--brand-500); color:var(--brand-700); background:var(--brand-25); }

.btn--ghost{ background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.30); }
.btn--ghost:hover{ background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.55); }
.btn--dark{ background:var(--neutral-800); color:#fff; border-color:var(--neutral-800); }
.btn--dark:hover{ background:var(--neutral-700); border-color:var(--neutral-700); }
.btn--dark:active{ background:var(--neutral-900); border-color:var(--neutral-900); }

.link-arrow{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.9375rem; font-weight:600; color:var(--brand-700);
  transition:gap var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
}
.link-arrow:hover{ gap:11px; color:var(--brand-500); }
.link-arrow svg{ width:16px; height:16px; flex-shrink:0; }

/* ───────────────────────────  6. 徽章 / 药丸  ─────────────────────────── */
.badge{
  display:inline-flex; align-items:center; gap:5px;
  font-size:.6875rem; font-weight:600; letter-spacing:.03em;
  padding:5px 11px; border-radius:var(--radius-full);
  border:1px solid transparent; white-space:nowrap;
}
.badge--brand{ background:var(--brand-50); color:var(--brand-700); border-color:var(--brand-100); }
.badge--neutral{ background:var(--neutral-100); color:var(--neutral-600); border-color:var(--neutral-200); }
.badge--success{ background:rgba(14,159,110,.09); color:#0B7C57; border-color:rgba(14,159,110,.22); }
.badge--tech{ background:rgba(37,99,235,.08); color:#1D4ED8; border-color:rgba(37,99,235,.20); }
.dark .badge--neutral{ background:rgba(255,255,255,.07); color:var(--text-on-dark-muted); border-color:rgba(255,255,255,.16); }
.dark .badge--brand{ background:rgba(79,179,232,.14); color:var(--brand-200); border-color:rgba(79,179,232,.30); }
.dark .badge--success{ background:rgba(14,159,110,.14); color:#4ADE9E; border-color:rgba(14,159,110,.30); }
.dark .badge--tech{ background:rgba(79,179,232,.12); color:var(--brand-100); border-color:rgba(79,179,232,.26); }

.pills{ display:flex; flex-wrap:wrap; gap:var(--space-xs); }
.pill{
  display:inline-flex; align-items:center;
  height:40px; padding:0 20px;
  font-size:.875rem; font-weight:600; color:var(--text-secondary);
  background:#fff; border:1px solid var(--border-subtle);
  border-radius:var(--radius-full);
  transition:all var(--duration-fast) var(--ease-standard);
}
.pill:hover{ border-color:var(--brand-300); color:var(--brand-700); }
.pill.is-active{ background:var(--brand-500); color:#fff; border-color:var(--brand-500); }
.dark .pill{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.16); color:var(--text-on-dark-muted); }
.dark .pill:hover{ border-color:var(--brand-200); color:#fff; }
.dark .pill.is-active{ background:var(--brand-500); color:#fff; border-color:var(--brand-500); }

/* ───────────────────────────  7. 导航  ─────────────────────────── */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:200;
  height:var(--nav-h); background:#fff;
  border-bottom:1px solid transparent;
  transition:border-color var(--duration-base) var(--ease-standard),
             box-shadow var(--duration-base) var(--ease-standard),
             background var(--duration-base) var(--ease-standard);
}
.nav--sol{ border-bottom-color:var(--border-subtle); box-shadow:0 1px 12px rgba(20,23,28,.05); }
.nav__inner{
  height:100%; max-width:var(--container); margin-inline:auto;
  padding-inline:clamp(20px,4vw,40px);
  display:flex; align-items:center; gap:var(--space-xl);
}
.nav__logo{ display:flex; align-items:center; flex-shrink:0; }
.nav__links{
  display:flex; align-items:center; gap:clamp(14px,2.2vw,34px); margin-inline:auto;
}
.nav__links a{
  position:relative; font-size:.9375rem; font-weight:500;
  color:var(--text-primary); padding-block:6px;
  transition:color var(--duration-fast) var(--ease-standard);
}
.nav__links a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background:var(--brand-500); transform:scaleX(0); transform-origin:left;
  transition:transform var(--duration-base) var(--ease-out-soft);
}
.nav__links a:hover{ color:var(--brand-600); }
.nav__links a:hover::after{ transform:scaleX(1); }
.nav__right{ display:flex; align-items:center; gap:var(--space-sm); flex-shrink:0; }
.nav__burger{
  display:none; width:42px; height:42px;
  align-items:center; justify-content:center;
  border:1px solid var(--border-subtle); border-radius:var(--radius-md);
  color:var(--text-primary);
}
.nav__burger svg{ width:20px; height:20px; }

/* 导航下拉菜单（通用照明 → 家居/商业/户外）
   ⚠️ 显隐由 js/app.js 加/去 .is-open 控制，**不要**改回纯 :hover --
      之前用 opacity+visibility 过渡实现，依赖的是「离散属性」，
      鼠标快速进出或从 bfcache 返回时状态可能残留，表现为"只有第一次能展开"。
      display 切换没有中间态，配 JS 的延迟关闭最稳。
      :hover 规则保留，仅作为**无 JS 时的兜底**。 */
.nav__dropdown{ position:relative; }
.nav__dropdown-trigger{ display:inline-flex; align-items:center; gap:4px; }
.nav__dropdown-menu{
  position:absolute;
  /* top:100% 紧贴触发器，视觉悬浮感交给 margin-top；
     下方 ::before 桥接区把那几像素空隙接住，鼠标移入菜单时不会断线。 */
  top:100%; margin-top:6px; left:0;
  min-width:172px; background:#fff;
  border:1px solid var(--border-subtle); border-radius:var(--radius-md);
  box-shadow:0 12px 32px rgba(9,14,20,.12);
  padding:8px 0;
  display:none;
  z-index:100;
}
/* 桥接区：向上覆盖 margin-top 造成的空隙。透明，不挡下方正文。 */
.nav__dropdown-menu::before{
  content:""; position:absolute; left:0; right:0; top:-12px; height:12px;
}
.nav__dropdown.is-open .nav__dropdown-menu,
.nav__dropdown:hover .nav__dropdown-menu{
  display:block;
}
.nav__dropdown.is-open .nav__dropdown-menu{
  animation:dropdownIn .16s var(--ease-out-soft) both;
}
@keyframes dropdownIn{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:none; }
}
.nav__dropdown-menu a{
  display:block; padding:9px 18px;
  font-size:.9375rem; font-weight:500;
  color:var(--text-primary); white-space:nowrap;
}
.nav__dropdown-menu a:hover{ color:var(--brand-600); background:var(--brand-25); }
.nav__dropdown-menu a::after{ display:none; } /* 下拉项不要底部下划线 */

/* 注：js/app.js 仍会切换 .nav--transparent / .nav--sol / .nav--dark / .is-open 等类。
   v2 导航是**恒定白底**，所以 `.nav--transparent` 与 `.nav--dark` 刻意**不定义样式** ——
   它们只作为 JS 的状态锚点存在，不是"样式缺失"。`.nav--sol` 则是滚动后的收边效果。 */

/* 品牌图：v2 导航恒为白底 → 默认显示深色原版；
   白字版仅用于深色页脚（.brand-img--footer 处直接指定文件） */
.brand-swap{ display:grid; }
.brand-swap img{ grid-area:1/1; }
.brand-img{ width:auto; object-fit:contain; }
.brand-img--nav{ height:34px; }
.brand-img--footer{ height:40px; }
.brand-img--on-dark{ display:none; }
.brand-img--on-light{ display:block; }

/* 移动端抽屉 */
.drawer{
  position:fixed; inset:0; z-index:300;
  background:var(--ink-950);
  padding:calc(var(--nav-h) + 24px) clamp(24px,6vw,48px) 48px;
  display:flex; flex-direction:column; gap:var(--space-md);
  opacity:0; visibility:hidden;
  transition:opacity var(--duration-base) var(--ease-standard), visibility var(--duration-base);
}
.drawer.is-open{ opacity:1; visibility:visible; }
.drawer a:not(.btn){
  font-family:var(--font-heading); font-size:1.5rem; font-weight:600;
  color:var(--text-on-dark); padding-block:10px;
  border-bottom:1px solid var(--ink-700);
  opacity:0; transform:translateY(12px);
  transition:opacity .45s var(--ease-out-soft), transform .45s var(--ease-out-soft), color .15s;
}
.drawer.is-open a:not(.btn){ opacity:1; transform:none; }
.drawer a:not(.btn):hover{ color:var(--brand-200); }
.drawer__close{
  position:absolute; top:20px; right:clamp(24px,6vw,48px);
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  color:var(--text-on-dark); border:1px solid var(--ink-700); border-radius:var(--radius-md);
}
.drawer__close svg{ width:20px; height:20px; }
.drawer__cta{ margin-top:var(--space-md); }
.drawer__sub{
  font-size:1.125rem !important; font-weight:500 !important;
  padding-left:24px !important; color:var(--text-muted) !important;
  border-bottom:none !important;
}
.drawer__sub:hover{ color:var(--brand-200) !important; }

/* ───────────────────────────  8. Hero  ─────────────────────────── */
/* 满幅实景图 + 图上叠字 */
.hero-home{
  position:relative; min-height:min(94vh,940px);
  display:flex; align-items:flex-end;
  padding-top:var(--nav-h);
  background:var(--ink-950); overflow:hidden;
}
.hero-home__grid,
.hero-home__beam,
.hero-home__ambient{ display:none; }   /* v1 光效装饰退役 */
.hero-home__inner{
  position:relative; z-index:2; width:100%;
  max-width:var(--container); margin-inline:auto;
  padding:clamp(40px,7vw,88px) clamp(20px,4vw,40px) clamp(48px,7vw,88px);
}
.hero-lamp{ display:none; }

/* Hero 背景图与遮罩 */
.hero-media{ position:absolute; inset:0; z-index:0; }
.hero-media img{ width:100%; height:100%; object-fit:cover; }
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(11,16,21,.55) 0%,rgba(11,16,21,.35) 40%,rgba(11,16,21,.82) 100%);
}
/* 白天外景照：左下角压暗承托文字，右上角留出画面 —— 单层渐变，
   ⚠️ 不要用两层叠加：alpha 会相乘，很容易把整块压成全黑（实测踩到过）。 */
.hero-media--soft::after{
  background:linear-gradient(100deg,
    rgba(9,14,20,.92) 0%,
    rgba(9,14,20,.84) 26%,
    rgba(9,14,20,.58) 48%,
    rgba(9,14,20,.24) 72%,
    rgba(9,14,20,.08) 100%);
}
/* 图片本身轻微降饱和，避免彩色照片与品牌蓝打架 */
.hero-media img{ filter:saturate(.82) contrast(1.04); }
.hero-home .h1,.hero-home .h2,.hero-home .display,.hero-home .display-xl{ color:#fff; }
.hero-home .body-l,.hero-home .small,.hero-home .text-secondary{ color:rgba(255,255,255,.86); }
/* 底图不可控（白天外景/车间/实验室都可能），文字加一层极轻投影兜底可读性 */
.hero-home__inner > *{ text-shadow:0 1px 12px rgba(9,14,20,.55); }
.hero-chip{ text-shadow:none; }
.hero-home .overline{ color:var(--brand-200); }

/* Hero 信息胶囊（原玻璃拟态，v2 改为半透明白） */
.hero-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:10px 18px; border-radius:var(--radius-full);
  border:1px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(14px) saturate(130%);
  -webkit-backdrop-filter:blur(14px) saturate(130%);
  color:rgba(255,255,255,.86) !important;
}
.hero-chip span{ color:var(--brand-200); font-weight:600; }

/* Hero 上方/下方内容叠加层（用于子页大图 Hero） */
.hero-overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg,rgba(11,16,21,.50) 0%,rgba(11,16,21,.30) 45%,rgba(11,16,21,.78) 100%);
}
/* 图片区块通用：满幅图容器 */
.figure-band{
  position:relative; overflow:hidden; background:var(--ink-900);
}
.figure-band img{ width:100%; height:100%; object-fit:cover; }
.figure-band__caption{
  position:absolute; left:0; right:0; bottom:0;
  padding:var(--space-xl); color:#fff;
  background:linear-gradient(180deg,transparent,rgba(11,16,21,.78));
}

/* 子页 Hero：白底 + 面包屑 */
.hero-light{ background:var(--surface-bg); }
.hero-light--sub{ padding-top:calc(var(--nav-h) + 56px); padding-bottom:var(--space-4xl); }
.hero-light--sub-sm{ padding-top:calc(var(--nav-h) + 40px); padding-bottom:var(--space-3xl); }
.hero-light__ambient{ display:none; }
.hero-breadcrumb{
  display:flex; align-items:center; gap:8px;
  font-size:.8125rem; color:var(--text-tertiary); margin-bottom:var(--space-lg);
}
.hero-breadcrumb a:hover{ color:var(--brand-600); }
.hero-split{ position:relative; overflow:hidden; }

/* ───────────────────────────  9. 图片卡片  ─────────────────────────── */
/* 图片媒体卡：直角、图上叠字、hover 轻微放大（OKT 式） */
.media-card{
  position:relative; display:block; overflow:hidden;
  background:var(--surface-sunken);
  border-radius:var(--radius-xs);
}
.media-card img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform var(--duration-slow) var(--ease-out-soft);
}
.media-card:hover img{ transform:scale(1.04); }
.media-card__label{
  position:absolute; left:0; right:0; bottom:0;
  padding:var(--space-lg) var(--space-lg) var(--space-md);
  background:linear-gradient(180deg,transparent 0%,rgba(11,16,21,.72) 100%);
  color:#fff;
}
.media-card__label h3,.media-card__label h4{ color:#fff; }
.media-card__label p{ color:rgba(255,255,255,.78); }
.media-card--flat .media-card__label{ position:static; background:none; color:var(--text-primary); padding:var(--space-md) 0 0; }
.media-card--flat .media-card__label h3,
.media-card--flat .media-card__label h4{ color:var(--text-primary); }
.media-card--flat .media-card__label p{ color:var(--text-secondary); }

/* 通用卡 */
.card{
  background:var(--surface-card);
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);
  padding:var(--space-lg);
  transition:border-color var(--duration-base) var(--ease-standard),
             box-shadow var(--duration-base) var(--ease-standard),
             transform var(--duration-base) var(--ease-standard);
}
.card:hover{ border-color:var(--brand-200); box-shadow:var(--shadow-raised); transform:translateY(-2px); }
.card-lum{ background:var(--surface-card); border:1px solid var(--border-subtle); border-radius:var(--radius-md); }
.dark .card,.dark .card-lum{ background:var(--ink-800); border-color:var(--ink-700); }

/* 产品卡（图片在上、规格在下） */
.product-card{
  display:flex; flex-direction:column;
  background:var(--surface-card);
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md); overflow:hidden;
  transition:border-color var(--duration-base) var(--ease-standard),
             box-shadow var(--duration-base) var(--ease-standard),
             transform var(--duration-base) var(--ease-standard);
}
.product-card:hover{ border-color:var(--brand-200); box-shadow:var(--shadow-floating); transform:translateY(-3px); }
.product-card__media{
  position:relative; aspect-ratio:1/1; background:#fff;
  display:flex; align-items:center; justify-content:center;
  border-bottom:1px solid var(--border-subtle); overflow:hidden;
}
.product-card__media img{ width:100%; height:100%; object-fit:contain; padding:var(--space-xl); }
/* 无图时的占位（原官网未提供该产品图） */
.product-card__media--empty{
  display:grid; place-items:center; width:100%; height:100%;
  color:var(--text-tertiary); font-size:.8125rem; letter-spacing:.04em;
  background:repeating-linear-gradient(45deg,var(--neutral-50) 0 10px,var(--neutral-100) 10px 20px);
}
.product-card__badges{ position:absolute; top:10px; left:10px; display:flex; gap:6px; }
.product-card__body{ padding:var(--space-xl) var(--space-lg) var(--space-lg); display:flex; flex-direction:column; gap:var(--space-sm); flex:1; }
.product-card__cat{
  font-family:var(--font-mono); font-size:.6875rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--brand-600);
}
.product-card__title{ font-family:var(--font-heading); font-size:1rem; font-weight:600; line-height:1.35; }
.product-card__specs{ display:flex; flex-wrap:wrap; gap:var(--space-lg); margin-top:var(--space-md); padding-top:var(--space-md); border-top:1px solid var(--border-subtle); }
/* 卡片底部可能并列两个入口（规格书下载 + 技术资料），需横向排布并留间距 */
.product-card__foot{
  margin-top:auto; padding-top:var(--space-md);
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-md);
}
.product-card--dark{ background:var(--ink-800); border-color:var(--ink-700); color:var(--text-on-dark); }
.product-card--dark .product-card__media{ background:var(--ink-900); border-bottom-color:var(--ink-700); }
.product-card--dark .product-card__cat{ color:var(--brand-200); }

.mini-spec{ display:flex; flex-direction:column; gap:2px; }
.mini-spec__k{
  font-family:var(--font-mono); font-size:.625rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary);
}
.mini-spec__v{ font-family:var(--font-mono); font-size:.8125rem; font-weight:500; color:var(--text-primary); }
.dark .mini-spec__k,.product-card--dark .mini-spec__k{ color:var(--text-on-dark-muted); }
.dark .mini-spec__v,.product-card--dark .mini-spec__v{ color:var(--text-on-dark); }

/* 规格方框 */
.spec-box{
  display:flex; flex-direction:column; gap:2px;
  padding:var(--space-md); background:var(--surface-alt);
  border:1px solid var(--border-subtle); border-radius:var(--radius-sm);
}
.spec-box__k{
  font-family:var(--font-mono); font-size:.625rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary);
}
.spec-box__v{ font-family:var(--font-mono); font-size:.9375rem; font-weight:500; }
.spec-box__u{ font-family:var(--font-mono); font-size:.75rem; color:var(--text-tertiary); }
.dark .spec-box{ background:var(--ink-800); border-color:var(--ink-700); }
.dark .spec-box__k{ color:var(--text-on-dark-muted); }
.dark .spec-box__v{ color:var(--text-on-dark); }

/* 案例卡 */
.case-card{
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--border-subtle); border-radius:var(--radius-md);
  background:var(--surface-card);
  transition:border-color var(--duration-base) var(--ease-standard),
             box-shadow var(--duration-base) var(--ease-standard),
             transform var(--duration-base) var(--ease-standard);
}
.case-card:hover{ border-color:var(--brand-200); box-shadow:var(--shadow-floating); transform:translateY(-3px); }
.case-card__media{ position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--surface-sunken); }
.case-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--duration-slow) var(--ease-out-soft); }
.case-card:hover .case-card__media img{ transform:scale(1.05); }
.case-card__body{ padding:var(--space-lg); display:flex; flex-direction:column; gap:var(--space-xs); }

/* 业务线卡（大图 + 圆形图标 + 说明） */
.biz-card{
  position:relative; display:flex; flex-direction:column;
  overflow:hidden; border-radius:var(--radius-md);
  border:1px solid var(--border-subtle); background:var(--surface-card);
  transition:border-color var(--duration-base) var(--ease-standard),
             box-shadow var(--duration-base) var(--ease-standard),
             transform var(--duration-base) var(--ease-standard);
}
.biz-card:hover{ border-color:var(--brand-200); box-shadow:var(--shadow-floating); transform:translateY(-3px); }
.biz-card__glow{ display:none; }   /* v1 光效退役 */
.biz-card__media{ position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--surface-sunken); }
.biz-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--duration-slow) var(--ease-out-soft); }
.biz-card:hover .biz-card__media img{ transform:scale(1.05); }
.biz-card__body{ padding:var(--space-lg); display:flex; flex-direction:column; gap:var(--space-sm); flex:1; }
.biz-card__icon{
  width:52px; height:52px; border-radius:var(--radius-full);
  display:flex; align-items:center; justify-content:center;
  background:var(--brand-50); color:var(--brand-600);
  border:1px solid var(--brand-100); margin-top:calc(var(--space-lg) * -1.9);
  position:relative; z-index:2;
}
.biz-card__icon svg{ width:24px; height:24px; }
.biz-card__tag{
  font-family:var(--font-mono); font-size:.6875rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--brand-600);
}
.biz-card--plant .biz-card__icon{ background:#EAF7EF; color:#0E9F6E; border-color:#C8EBD8; }
.biz-card--plant .biz-card__tag{ color:#0B7C57; }

/* 特性块 */
.feature{ display:flex; gap:var(--space-md); align-items:flex-start; }
.feature__icon{
  width:44px; height:44px; flex-shrink:0; border-radius:var(--radius-md);
  display:flex; align-items:center; justify-content:center;
  background:var(--brand-50); color:var(--brand-600); border:1px solid var(--brand-100);
}
.feature__icon svg{ width:22px; height:22px; }
.dark .feature__icon{ background:rgba(79,179,232,.12); color:var(--brand-200); border-color:rgba(79,179,232,.26); }
.dark .feature p{ color:var(--text-on-dark-muted); }

/* 数据统计 */
.stat{ display:flex; flex-direction:column; gap:var(--space-2xs); }
.stat__num{ font-family:var(--font-mono); font-size:clamp(2.2rem,4.2vw,3.5rem); font-weight:600; line-height:1; color:var(--brand-600); letter-spacing:-.03em; }
.stat__unit{ font-family:var(--font-mono); font-size:1.15rem; color:var(--text-secondary); margin-left:4px; }
.stat__label{ font-size:.8125rem; color:var(--text-secondary); }
.dark .stat__num{ color:var(--brand-200); }
.dark .stat__label,.dark .stat__unit{ color:var(--text-on-dark-muted); }

/* ───────────────────────────  10. 内容区块  ─────────────────────────── */
/* 流程时间轴 */
.timeline{ position:relative; display:grid; gap:var(--space-2xl); }
.timeline__step{ position:relative; padding-left:var(--space-3xl); }
.timeline__dot{
  position:absolute; left:0; top:4px;
  width:36px; height:36px; border-radius:var(--radius-full);
  display:flex; align-items:center; justify-content:center;
  background:var(--brand-500); color:#fff;
  font-family:var(--font-mono); font-size:.8125rem; font-weight:600;
}
.timeline__body{ display:flex; flex-direction:column; gap:var(--space-xs); }
.timeline__meta{
  font-family:var(--font-mono); font-size:.6875rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary);
}
.dark .timeline__meta{ color:var(--text-on-dark-muted); }
.dark .timeline__dot{ background:var(--brand-400); color:#fff; }

/* 技术参数表 */
.table-wrap{ overflow-x:auto; border:1px solid var(--border-subtle); border-radius:var(--radius-md); background:#fff; }
.tech-table{ width:100%; border-collapse:collapse; font-family:var(--font-mono); font-size:.8125rem; }
.tech-table th{
  font-size:.6875rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-secondary); text-align:left;
  padding:var(--space-md) var(--space-md); background:var(--surface-alt);
  border-bottom:1px solid var(--border-strong); white-space:nowrap;
}
.tech-table td{ padding:var(--space-md); border-bottom:1px solid var(--border-subtle); color:var(--text-primary); }
.tech-table tbody tr:nth-child(odd){ background:var(--neutral-25); }
.tech-table tbody tr:hover{ background:var(--brand-25); }
.tech-table .unit{ color:var(--text-tertiary); }
.dark .table-wrap{ background:var(--ink-800); border-color:var(--ink-700); }
.dark .tech-table th{ background:var(--ink-800); color:var(--text-on-dark-muted); border-bottom-color:var(--ink-600,#2C3B4D); }
.dark .tech-table td{ color:var(--text-on-dark); border-bottom-color:var(--ink-700); }
.dark .tech-table tbody tr:nth-child(odd){ background:var(--ink-900); }
.dark .tech-table tbody tr:hover{ background:var(--ink-700); }

/* 认证墙 */
.logo-wall{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:1px; background:var(--border-subtle);
  border:1px solid var(--border-subtle); border-radius:var(--radius-md); overflow:hidden;
}
.logo-wall__item{
  display:flex; align-items:center; justify-content:center; gap:var(--space-xs);
  min-height:92px; padding:var(--space-md);
  background:#fff; color:var(--text-secondary);
  font-family:var(--font-mono); font-size:.8125rem; font-weight:600; letter-spacing:.04em;
  transition:background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
}
.logo-wall__item:hover{ background:var(--brand-25); color:var(--brand-700); }
.dark .logo-wall{ background:var(--ink-700); border-color:var(--ink-700); }
.dark .logo-wall__item{ background:var(--ink-800); color:var(--text-on-dark-muted); }
.dark .logo-wall__item:hover{ background:var(--ink-700); color:var(--brand-200); }

/* 光谱面板（植物灯页） */
.spectrum-panel{
  background:var(--ink-900); border:1px solid var(--ink-700);
  border-radius:var(--radius-md); padding:var(--space-lg);
}
.spectrum-panel__head{ display:flex; justify-content:space-between; align-items:center; gap:var(--space-md); flex-wrap:wrap; margin-bottom:var(--space-md); }
.spectrum-panel svg{ width:100%; height:auto; }
.trace-path{
  stroke-dasharray:1400; stroke-dashoffset:1400;
  transition:stroke-dashoffset 1.6s var(--ease-out-soft);
}
.trace-path.is-drawn{ stroke-dashoffset:0; }
.spectrum-area{ opacity:.5; }

/* 技术带（图文并排） */
.tech-band{ position:relative; background:var(--ink-900); color:var(--text-on-dark); overflow:hidden; }
.tech-band__inner{ position:relative; z-index:2; }
.tech-band__grid,.tech-band__ambient{ display:none; }

/* CTA 带 */
.cta-band{ position:relative; overflow:hidden; background:var(--ink-900); color:var(--text-on-dark); }
.cta-band__beam,.cta-band__ambient{ display:none; }
.cta-band .container{ position:relative; z-index:2; }

/* 场景可视块（内联 SVG 图区） */
.scene-visual{
  position:relative; border-radius:var(--radius-md); overflow:hidden;
  background:var(--surface-sunken); border:1px solid var(--border-subtle);
}
.scene-visual svg{ display:block; width:100%; height:auto; }
.dark .scene-visual{ background:var(--ink-800); border-color:var(--ink-700); }

/* ───────────────────────────  11. 表单  ─────────────────────────── */
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-size:.8125rem; font-weight:600; color:var(--text-secondary); }
.input,.textarea,.select{
  width:100%; min-height:48px; padding:12px 16px;
  font-family:var(--font-body); font-size:.9375rem; color:var(--text-primary);
  background:#fff; border:1px solid var(--border-strong); border-radius:var(--radius-md);
  transition:border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-standard);
}
.textarea{ min-height:132px; resize:vertical; line-height:1.65; }
.input::placeholder,.textarea::placeholder{ color:var(--text-tertiary); }
.input:focus,.textarea:focus,.select:focus{
  outline:none; border-color:var(--brand-500);
  box-shadow:0 0 0 3px rgba(0,112,192,.14);
}
.helper{ font-family:var(--font-mono); font-size:.75rem; color:var(--text-tertiary); }
.dark .field label{ color:var(--text-on-dark-muted); }
.dark .input,.dark .textarea,.dark .select{ background:var(--ink-800); border-color:var(--ink-700); color:var(--text-on-dark); }

/* ───────────────────────────  12. 页脚  ─────────────────────────── */
.footer{ background:var(--ink-950); color:var(--text-on-dark); }
.footer__grid{
  display:grid; grid-template-columns:1.6fr repeat(3,1fr);
  gap:var(--space-2xl); padding-bottom:var(--space-2xl);
}
.footer__logo{ margin-bottom:var(--space-md); }
.footer__col{ display:flex; flex-direction:column; gap:10px; }
.footer__col h4{
  font-size:.6875rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-on-dark-muted); margin-bottom:var(--space-xs);
}
.footer__col a{ font-size:.875rem; color:rgba(255,255,255,.72); transition:color var(--duration-fast) var(--ease-standard); }
.footer__col a:hover{ color:var(--brand-200); }
.footer__bottom{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:var(--space-md); padding-top:var(--space-lg);
  border-top:1px solid var(--ink-700);
  font-size:.8125rem; color:var(--text-on-dark-muted);
}
.footer__bottom a{ color:var(--text-on-dark-muted); }
.footer__bottom a:hover{ color:var(--brand-200); }

/* ───────────────────────────  13. 动效  ─────────────────────────── */
.reveal{
  opacity:0; transform:translateY(18px);
  transition:opacity var(--duration-slow) var(--ease-out-soft),
             transform var(--duration-slow) var(--ease-out-soft);
}
.reveal.is-in{ opacity:1; transform:none; }
.reveal-d1{ transition-delay:80ms; }
.reveal-d2{ transition-delay:160ms; }
.reveal-d3{ transition-delay:240ms; }
.reveal-d4{ transition-delay:320ms; }
.ignite{ animation:ignite .9s var(--ease-out-soft) both; }
@keyframes ignite{ from{ opacity:0; } to{ opacity:1; } }
.sheen{ position:relative; }

/* ───────────────────────────  14. 响应式  ─────────────────────────── */
@media (max-width:1080px){
  .nav__links{ display:none; }
  .nav__burger{ display:inline-flex; }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:var(--space-xl); }
  .grid-4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:900px){
  :root{ --nav-h:72px; }
  .section{ padding-block:var(--space-3xl); }
  .section-lg{ padding-block:var(--space-4xl); }
  .grid-3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-home{ min-height:min(78vh,640px); }
}
@media (max-width:640px){
  :root{ --nav-h:64px; }
  body{ font-size:15px; }
  .section{ padding-block:var(--space-2xl); }
  .section-lg{ padding-block:var(--space-3xl); }
  .grid-2,.grid-3,.grid-4{ grid-template-columns:minmax(0,1fr); }
  .footer__grid{ grid-template-columns:minmax(0,1fr); }
  .footer__bottom{ flex-direction:column; align-items:flex-start; }
  .timeline__step{ padding-left:var(--space-2xl); }
  .hero-home{ min-height:auto; padding-top:calc(var(--nav-h) + 40px); }
  .btn{ height:46px; padding:0 20px; }
  .btn--lg{ height:50px; padding:0 24px; }
  .display-xl{ font-size:clamp(2rem,9vw,2.6rem); }
  .display{ font-size:clamp(1.7rem,7.5vw,2.1rem); }
}
@media (max-width:400px){
  .brand-img--nav{ height:28px; }
}

/* ───────────────────────────  15. 无障碍  ─────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .reveal{ opacity:1; transform:none; }
  .trace-path{ stroke-dashoffset:0; }
  .media-card:hover img,.case-card:hover .case-card__media img,.biz-card:hover .biz-card__media img{ transform:none; }
}
@media print{
  .nav,.drawer,.cta-band{ display:none !important; }
  body{ background:#fff; }
}


/* ── 语言切换器（v0.12.0）───────────────────────────────────────────────
   放在导航右侧、与「获取报价」按钮并排。
   中文页显示 EN、英文页显示 中文 —— 互为入口。 */
.lang-switch{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:34px;padding:0 10px;
  font-size:12.5px;font-weight:600;letter-spacing:.02em;
  color:var(--text-secondary);text-decoration:none;
  border:1px solid var(--border-strong);border-radius:var(--radius-pill,999px);
  transition:color .18s ease,border-color .18s ease,background-color .18s ease;
}
.lang-switch:hover{color:var(--brand-500);border-color:var(--brand-500);background:var(--brand-25);}
@media (max-width:900px){.lang-switch{height:30px;min-width:36px;font-size:12px;}}

/* ═══════════════════════════════════════════════════════════════════════
   Cookie 同意横幅 & 偏好中心（v0.15.0）
   ---------------------------------------------------------------------
   原则：不遮挡内容、不锁滚动（面板打开时才锁）、不引入第三方资源。
   浅色表面的悬浮层用 --shadow-overlay 与页面拉开层级。
   ═══════════════════════════════════════════════════════════════════════ */

/* 仅供屏幕阅读器 */
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* 面板打开时锁住背景滚动 */
body.cc-locked{ overflow:hidden; }

/* ── 横幅 ────────────────────────────────────────────────────────────── */
.cc-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:1200;
  background:var(--surface-bg);
  border-top:1px solid var(--border-subtle);
  box-shadow:0 -12px 40px rgba(20,23,28,.14);
  padding-block:var(--space-md);
  opacity:0; transform:translateY(14px);
  transition:opacity .24s var(--ease-out-soft), transform .24s var(--ease-out-soft);
}
.cc-banner.is-in{ opacity:1; transform:none; }
.cc-banner[hidden]{ display:none; }   /* 覆盖 flex/块级设置，保证 hidden 生效 */

.cc-banner__inner{
  display:flex; align-items:flex-start; gap:var(--space-lg);
  flex-wrap:wrap; justify-content:space-between;
}
.cc-banner__copy{ flex:1 1 540px; min-width:0; }
.cc-banner__title{
  margin:0 0 var(--space-xs);
  font-size:1.125rem; font-weight:600; color:var(--text-primary);
  letter-spacing:-.01em;
}
.cc-banner__body{
  margin:0; font-size:.9375rem; line-height:1.7;
  color:var(--text-secondary); max-width:78ch;
}
.cc-banner__body strong{ color:var(--text-primary); font-weight:600; }
.cc-banner__links{
  margin-top:var(--space-sm);
  display:flex; gap:var(--space-md); flex-wrap:wrap;
}
.cc-banner__actions{
  display:flex; align-items:center; gap:var(--space-sm);
  flex-wrap:wrap; flex-shrink:0;
}

/* 统一按钮尺寸：站点的 .btn 默认偏高，这里压缩到横幅能容纳的高度 */
.cc-btn{
  height:42px; padding:0 18px; font-size:.875rem; white-space:nowrap;
}
.cc-linkbtn,
.cc-btn--text{
  height:42px; padding:0 6px;
  background:none; border:none; cursor:pointer;
  font-size:.875rem; font-weight:500;
  color:var(--text-brand); font-family:inherit;
  text-decoration:underline; text-underline-offset:3px;
  transition:color .18s ease;
}
.cc-linkbtn:hover,
.cc-btn--text:hover{ color:var(--text-brand-deep); }
.cc-linkbtn:focus-visible,
.cc-btn--text:focus-visible{
  outline:2px solid var(--brand-500); outline-offset:2px; border-radius:var(--radius-sm);
}

/* ── 遮罩与面板 ──────────────────────────────────────────────────────── */
.cc-overlay{
  position:fixed; inset:0; z-index:1300;
  display:flex; align-items:center; justify-content:center;
  padding:var(--space-lg);
  background:rgba(11,16,21,.46);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  opacity:0; transition:opacity .2s ease;
}
.cc-overlay.is-in{ opacity:1; }
.cc-overlay[hidden]{ display:none; }

.cc-panel{
  width:min(620px,100%); max-height:min(86vh,760px); overflow-y:auto;
  background:var(--surface-bg); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-overlay);
  padding:var(--space-xl);
  transform:translateY(10px) scale(.99);
  transition:transform .2s var(--ease-out-soft);
}
.cc-overlay.is-in .cc-panel{ transform:none; }

.cc-panel__head{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:var(--space-md); margin-bottom:var(--space-sm);
}
.cc-panel__title{
  margin:0; font-size:1.25rem; font-weight:600; color:var(--text-primary);
  letter-spacing:-.01em;
}
.cc-close{
  flex-shrink:0; width:34px; height:34px; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:var(--text-tertiary); cursor:pointer;
  background:none; border:none; border-radius:var(--radius-md); font-family:inherit;
  transition:color .18s ease, background-color .18s ease;
}
.cc-close:hover{ color:var(--text-primary); background:var(--surface-sunken); }

.cc-panel__intro{
  margin:0 0 var(--space-lg); font-size:.875rem; line-height:1.7;
  color:var(--text-secondary);
}
.cc-panel__intro strong{ color:var(--text-primary); font-weight:600; }

/* ── 分类行 ──────────────────────────────────────────────────────────── */
.cc-row{
  padding:var(--space-md) 0;
  border-top:1px solid var(--border-subtle);
}
.cc-row:first-of-type{ border-top:none; }
.cc-row--locked{ opacity:.82; }

.cc-row__head{ display:flex; align-items:center; gap:var(--space-sm); flex-wrap:wrap; }
.cc-row__title{
  margin:0; flex:1 1 auto; min-width:0;
  font-size:.9375rem; font-weight:600; color:var(--text-primary);
}
.cc-row__desc{
  margin:var(--space-xs) 0 0; font-size:.8125rem; line-height:1.68;
  color:var(--text-secondary); max-width:70ch;
}
.cc-row__desc strong{ color:var(--text-primary); font-weight:600; }

.cc-badge{
  flex-shrink:0; padding:3px 9px; border-radius:var(--radius-full);
  font-size:11px; font-weight:600; letter-spacing:.03em;
  background:var(--brand-50); color:var(--brand-700);
  border:1px solid var(--border-brand);
}
.cc-badge--locked{ background:var(--surface-sunken); color:var(--text-tertiary); border-color:var(--border-subtle); }

/* ── 开关 ────────────────────────────────────────────────────────────── */
.cc-switch{
  position:relative; flex-shrink:0;
  display:inline-flex; align-items:center; cursor:pointer;
}
.cc-switch__input{
  position:absolute; inset:0; width:100%; height:100%;
  margin:0; opacity:0; cursor:pointer;
}
.cc-switch__input:disabled{ cursor:not-allowed; }
.cc-switch__track{
  width:42px; height:24px; border-radius:var(--radius-full);
  background:var(--neutral-300);
  display:block; position:relative;
  transition:background-color .2s var(--ease-standard);
}
.cc-switch__dot{
  position:absolute; top:3px; left:3px;
  width:18px; height:18px; border-radius:50%;
  background:#fff; box-shadow:0 1px 2px rgba(20,23,28,.28);
  transition:transform .2s var(--ease-out-soft);
}
.cc-switch__input:checked + .cc-switch__track{ background:var(--brand-500); }
.cc-switch__input:checked + .cc-switch__track .cc-switch__dot{ transform:translateX(18px); }
.cc-switch__input:disabled + .cc-switch__track{ background:var(--neutral-200); opacity:.7; }
.cc-switch__input:checked:disabled + .cc-switch__track{ background:var(--brand-200); }
.cc-switch__input:focus-visible + .cc-switch__track{
  outline:2px solid var(--brand-500); outline-offset:3px;
}

.cc-panel__stamp{
  margin:var(--space-md) 0 0; font-size:.75rem; color:var(--text-tertiary);
  font-family:var(--font-mono);
}
.cc-panel__foot{
  display:flex; gap:var(--space-sm); flex-wrap:wrap;
  margin-top:var(--space-lg); padding-top:var(--space-lg);
  border-top:1px solid var(--border-subtle);
}
.cc-panel__hint{ margin:var(--space-md) 0 0; font-size:.75rem; color:var(--text-tertiary); }

/* ── 小屏：横幅改为堆叠，按钮铺满 ────────────────────────────────────── */
@media (max-width:720px){
  .cc-banner{ padding-block:var(--space-sm); }
  .cc-banner__inner{ gap:var(--space-md); }
  .cc-banner__actions{ width:100%; }
  .cc-banner__actions .cc-btn{ flex:1 1 auto; }
  .cc-panel{ padding:var(--space-lg); max-height:90vh; }
  .cc-panel__foot{ flex-direction:column; }
  .cc-panel__foot .cc-btn{ width:100%; }
}

@media (prefers-reduced-motion:reduce){
  .cc-banner, .cc-overlay, .cc-panel, .cc-switch__track, .cc-switch__dot{
    transition:none;
  }
  .cc-overlay.is-in .cc-panel{ transform:none; }
}

/* ── 页脚入口「Cookie 设置」（页脚是深色区，配色按 on-dark 走）──────── */
.footer__cc{
  /* <button> 要抹平浏览器默认样式，才能跟旁边的 span / a 排成一行 */
  background:none; border:none; padding:0; margin:0;
  font:inherit; font-size:inherit; line-height:inherit;
  color:var(--text-on-dark-muted); cursor:pointer;
  text-decoration:underline; text-underline-offset:3px;
  transition:color .18s ease;
}
.footer__cc:hover{ color:var(--brand-200); }
.footer__cc:focus-visible{
  outline:2px solid var(--brand-200); outline-offset:3px; border-radius:var(--radius-sm);
}
