/* ============================================================
   松田电子 STE Design System v2.1 「深蓝精密 Precision Blue」
   标准起步样式 · 2026-09-29 · 与 songtian-design-tokens.json 同源
   ------------------------------------------------------------
   用法：任何松田内部系统 / 新站点直接引入本文件起步：
     <link rel="stylesheet" href="songtian-design-system.css">
   字体文件从 04-VI与网页素材/字体资产/ 复制到项目 /assets/fonts/。
   规范文档：04-松田Design-System.md（冲突时以文档为准）。
   :root 由 _scripts/tokens-to-css.mjs 从 tokens JSON 生成（改 JSON，不手改 :root）；
   组件段与 BrandAgent/src/styles/20-components.css 同文（参考实现：BrandAgent/src/styles/）。
   红线：橙底必配墨蓝粗字；品牌色不得改动；LOGO 不重画；含单位或料号的文字不做 text-transform。
   ============================================================ */

@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url(/assets/fonts/jetbrains-mono-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* GENERATED:tokens-to-css — :root below is generated from songtian-design-tokens.json; edit the JSON, not this block */
:root{
  /* —— 品牌锚点（2018 数字母版，禁止改动） —— */
  --st-blue-600:#0A408A;            /* 品牌蓝 · PANTONE 287C */
  --st-orange-500:#E67817;          /* 品牌橙 · PANTONE 151C */
  /* —— 蓝阶 —— */
  --st-blue-50:#F2F6FB;--st-blue-100:#E1EAF6;--st-blue-200:#C3D5EC;--st-blue-300:#97B6DE;--st-blue-400:#6390CB;
  --st-blue-500:#3467AC;--st-blue-700:#093774;--st-blue-800:#082C5D;--st-blue-900:#062045;--st-blue-950:#04142C;
  /* —— 橙阶 —— */
  --st-orange-50:#FEF6EE;--st-orange-100:#FCE8D3;--st-orange-200:#F8CFA3;--st-orange-300:#F3B06B;
  --st-orange-400:#EE9238;--st-orange-600:#C96410;--st-orange-700:#A54F0E;--st-orange-800:#7E3C0D;
  --st-orange-900:#5C2C0B;
  /* —— 中性阶（冷蓝灰）；n-500 仅用于非文字，弱化文字用 n-550 —— */
  --st-n-0:#FFFFFF;--st-n-50:#F7F9FC;--st-n-100:#EFF3F8;--st-n-200:#DFE6EF;--st-n-300:#C4CEDC;
  --st-n-400:#9AA7BA;--st-n-500:#6E7D93;--st-n-550:#5A697F;--st-n-600:#4E5D75;--st-n-700:#3D4757;
  --st-n-800:#26334A;--st-n-900:#14243E;
  /* —— 语义层（组件一律用这层） —— */
  --st-text:#14243E;--st-text-2:#4E5D75;--st-text-muted:#5A697F;--st-link:#0A408A;--st-link-hover:#093774;
  --st-surface:#FFFFFF;--st-surface-alt:#F4F7FB;--st-surface-dark:#081A38;--st-surface-darkest:#050F24;
  --st-border:#DFE6EF;--st-border-strong:#C4CEDC;--st-accent:#E67817;--st-accent-hover:#EE9238;
  --st-accent-active:#C96410;
  --st-on-accent:#14243E;           /* 橙底唯一合法文字色（5.23:1 AA，字重>=600） */
  --st-eyebrow-light:#A54F0E;       /* 浅底 eyebrow / 小字橙 */
  /* —— 功能色；文字用 *-text —— */
  --st-success:#0E8A5F;--st-success-bg:#E8F5F0;--st-success-text:#0A7350;--st-warning:#B7791F;
  --st-warning-bg:#FBF3E4;--st-warning-text:#8A5A14;--st-danger:#C0392B;--st-danger-bg:#FAEBE9;
  --st-info:#3467AC;--st-info-bg:#F2F6FB;
  /* —— 焦点（outline 2px，偏移 2px，无圆角） —— */
  --st-focus-light:#C96410;         /* 浅色面 ≥3.26:1 */
  --st-focus-dark:#EE9238;          /* 深色面 7.25:1 */
  --st-focus-brand:#FFFFFF;         /* 品牌蓝面 9.94:1 */
  --st-focus-width:2px;--st-focus-offset:2px;
  /* —— 字体 —— */
  --st-sans:Inter,"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --st-mono:"JetBrains Mono","SF Mono",Consolas,"PingFang SC","Microsoft YaHei","Noto Sans SC",monospace;
  /* —— 几何 —— */
  --st-radius-xs:2px;--st-radius-sm:4px;--st-radius-md:8px;--st-radius-lg:12px;
  --st-shadow-xs:0 1px 2px rgba(8,26,56,.06);--st-shadow-sm:0 2px 8px rgba(8,26,56,.08);
  --st-shadow-md:0 8px 24px rgba(8,26,56,.10);--st-shadow-lg:0 16px 48px rgba(8,26,56,.14);
  /* —— 动效 —— */
  --st-ease:cubic-bezier(.2,0,0,1);--st-fast:120ms;--st-base:200ms;--st-slow:320ms;
  /* —— 布局（容器上限 1240，平板 900；页眉 78 / 68，不吸顶） —— */
  --st-container:1240px;--st-container-tablet:900px;--st-header-h:78px;--st-sticky-top:0px;
  /* —— 层级 —— */
  --st-z-sticky:40;--st-z-header:50;--st-z-dropdown:60;--st-z-fab:70;--st-z-overlay:78;--st-z-dialog:80;
  --st-z-toast:90;--st-z-skip:1000;
}
@media(max-width:680px){:root{--st-header-h:68px}}
/* /GENERATED:tokens-to-css */

/* —— 基础 —— */
*{box-sizing:border-box}
body.st-body{margin:0;font-family:var(--st-sans);font-size:16px;line-height:1.625;color:var(--st-text);background:var(--st-surface);-webkit-font-smoothing:antialiased}
/* 容器：上限 1240；≤1050 上限 900、两侧 20；≤680 两侧 15（与 BrandAgent .shell 一致） */
.st-container{width:min(var(--st-container),calc(100vw - 56px));margin-inline:auto}
@media(max-width:1050px){.st-container{width:min(100% - 40px,var(--st-container-tablet))}}
@media(max-width:680px){.st-container{width:calc(100% - 30px)}}

/* —— 焦点（验收项：全站键盘可达且焦点可见；浅色面 orange-600，深色面 orange-400，品牌蓝面白色；不加圆角） —— */
:focus-visible{outline:var(--st-focus-width) solid var(--st-focus-light);outline-offset:var(--st-focus-offset)}

/* —— 深色科技区块母题（Hero / 实力数据 / CTA / 页脚专用；正文区禁用） —— */
.st-dark .st-text-2{color:var(--st-blue-200)}
.st-circuit-grid{background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px}

/* —— Eyebrow 章节眉（▶ 橙三角；只对拉丁短语大写；浅底文字 orange-700） —— */
.st-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--st-orange-700)}
.st-eyebrow::before{content:'';width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:7px solid var(--st-accent)}
.st-dark .st-eyebrow{color:var(--st-blue-300)}

/* —— 菱形节点（LOGO 菱形 S 母题） —— */
.st-diamond{display:inline-block;width:8px;height:8px;background:var(--st-blue-600);transform:rotate(45deg)}
.st-diamond.accent{background:var(--st-accent)}
.st-tabular{font-variant-numeric:tabular-nums}

/* —— 卡片 —— */
.st-card{background:var(--st-surface);border:1px solid var(--st-border);border-radius:var(--st-radius-md);box-shadow:var(--st-shadow-xs);transition:box-shadow var(--st-base) var(--st-ease),transform var(--st-base) var(--st-ease)}
.st-card:hover{box-shadow:var(--st-shadow-md);transform:translateY(-2px)}
.st-card-notch{clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}/* 明星卡右上斜切，同屏最多一组 */

/* ============================================================
   组件 v2.1（与 BrandAgent/src/styles/20-components.css 同文）
   ============================================================ */

/* —— Buttons: Primary (orange, dark text) · Secondary (blue) · Outline · Ghost; sm 32 / md 40 / lg 48 —— */
.st-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 20px;border:1.5px solid transparent;border-radius:var(--st-radius-sm);font:inherit;font-size:15px;font-weight:600;line-height:1.25;text-align:center;text-decoration:none;cursor:pointer;transition:background-color var(--st-fast) var(--st-ease),border-color var(--st-fast) var(--st-ease),box-shadow var(--st-fast) var(--st-ease),color var(--st-fast) var(--st-ease)}
.st-btn svg{flex:none;width:18px;height:18px}
.st-btn-primary{color:var(--st-on-accent);background:var(--st-accent)}
.st-btn-primary:hover{background:var(--st-accent-hover);box-shadow:var(--st-shadow-sm)}
.st-btn-primary:active{background:var(--st-accent);box-shadow:inset 0 2px 4px rgba(8,26,56,.24)}
.st-btn-secondary{color:var(--st-n-0);background:var(--st-blue-600)}
.st-btn-secondary:hover{background:var(--st-blue-700)}
.st-btn-outline{color:var(--st-blue-600);background:transparent;border-color:var(--st-blue-600)}
.st-btn-outline:hover{background:var(--st-blue-50)}
.st-btn-ghost{color:var(--st-blue-600);background:transparent}
.st-btn-ghost:hover{background:var(--st-n-100)}
.st-btn-sm{min-height:32px;padding:0 12px;font-size:13px}
.st-btn-lg{min-height:48px;padding:0 24px;font-size:16px}
.st-btn:has(>.st-btn-meta){flex-wrap:wrap;row-gap:0;padding-block:6px}
.st-btn-meta{flex-basis:100%;font-size:11px;font-weight:500;line-height:1.35;opacity:.8}
.st-btn:is([disabled],[aria-disabled="true"]){color:var(--st-n-400);background:var(--st-n-100);border-color:transparent;box-shadow:none;cursor:not-allowed}

/* —— Tags (text labels, not badges) · counts · chips; radius-xs, no text-transform —— */
.st-tag{display:inline-flex;align-items:center;min-height:22px;padding:2px 8px;border:1px solid var(--st-n-300);border-radius:var(--st-radius-xs);color:var(--st-n-700);background:var(--st-n-0);font-size:11px;font-weight:600;line-height:1.3;letter-spacing:.02em;white-space:nowrap}
.st-tag-smd{color:var(--st-blue-700);background:var(--st-blue-50);border-color:var(--st-blue-200)}
.st-tag-auto{color:var(--st-blue-600);border-color:var(--st-blue-600)}
.st-tag-cert{color:var(--st-n-900);background:var(--st-n-50)}
.st-tag-status{color:var(--st-warning-text);background:var(--st-warning-bg);border-color:transparent}
.st-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;padding:1px 6px;border-radius:var(--st-radius-xs);color:var(--st-n-900);background:var(--st-n-100);font-family:var(--st-mono);font-size:11px;font-weight:600;line-height:1.5;font-variant-numeric:tabular-nums}
.st-count-strong{color:var(--st-n-0);background:var(--st-blue-600)}
.st-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 12px;border:1px solid var(--st-n-300);border-radius:var(--st-radius-xs);color:var(--st-blue-600);background:var(--st-n-0);font:inherit;font-size:13px;font-weight:600;line-height:1.25;text-decoration:none;cursor:pointer;transition:background-color var(--st-fast) var(--st-ease),border-color var(--st-fast) var(--st-ease)}
.st-chip:hover{background:var(--st-blue-50);border-color:var(--st-blue-300)}
.st-chip:is([aria-pressed="true"],[aria-current]:not([aria-current="false"]),.is-selected){color:var(--st-n-0);background:var(--st-blue-600);border-color:var(--st-blue-600)}
.st-chip:is([aria-pressed="true"],[aria-current]:not([aria-current="false"]),.is-selected) .st-count{color:inherit;background:rgba(255,255,255,.18)}

/* —— Counts generated from data (data-count) —— */
.st-stats{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 32px;margin:0;padding:0;color:var(--st-text-muted);font-size:14px;line-height:1.4;list-style:none}
.st-stats>*{display:flex;align-items:baseline;gap:8px;margin:0}
.st-stats dd{margin:0}
.st-stats [data-count]{color:var(--st-blue-600);font-family:var(--st-mono);font-size:28px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums}
.st-dark .st-stats{color:var(--st-blue-200)}
.st-dark .st-stats [data-count]{color:var(--st-n-0)}

/* —— Breadcrumb: › separators, product-tree order, ‹ parent at ≤680 —— */
.st-breadcrumb{color:var(--st-text-muted);font-size:13px;line-height:1.5}
.st-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none}
.st-breadcrumb li{display:inline-flex;align-items:center;min-width:0}
.st-breadcrumb li+li::before{content:"›";margin:0 8px;color:var(--st-n-400)}
.st-breadcrumb a{color:var(--st-blue-600);text-decoration:none}
.st-breadcrumb a:hover{color:var(--st-blue-700);text-decoration:underline}
.st-breadcrumb [aria-current]{color:var(--st-n-900);font-weight:600}

/* —— Disclosure (<details>): h5 summary, rotating chevron, all open in print —— */
.st-disclosure{border-top:1px solid var(--st-n-200)}
.st-disclosure:last-of-type{border-bottom:1px solid var(--st-n-200)}
.st-disclosure-title{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:14px 40px 14px 0;color:var(--st-n-900);font-size:17px;font-weight:600;line-height:24px;list-style:none;cursor:pointer}
.st-disclosure>summary{display:block;list-style:none;cursor:pointer}
.st-disclosure>summary::-webkit-details-marker,.st-disclosure-title::-webkit-details-marker{display:none}
.st-disclosure-title::after{content:"";position:absolute;right:14px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:2px solid var(--st-blue-600);border-bottom:2px solid var(--st-blue-600);transform:rotate(45deg);transition:transform var(--st-base) var(--st-ease)}
.st-disclosure[open]>.st-disclosure-title::after,.st-disclosure[open]>summary>.st-disclosure-title::after{margin-top:-2px;transform:rotate(-135deg)}
.st-disclosure-title:hover{color:var(--st-blue-600)}
.st-disclosure-body{padding:0 0 24px}

/* —— States: empty · error · loading; status notes (series / catalog / on request) —— */
.st-empty,.st-error{display:grid;justify-items:start;gap:12px;padding:24px;border:1px dashed var(--st-n-300);border-radius:var(--st-radius-md);color:var(--st-n-700);background:var(--st-n-50);font-size:15px;line-height:1.6}
.st-error{border:1px solid var(--st-danger);background:var(--st-danger-bg)}
.st-empty>p,.st-error>p{max-width:72ch;margin:0}
.st-empty>:is(strong,b,h2,h3),.st-error>:is(strong,b,h2,h3){margin:0;color:var(--st-n-900);font-size:16px;font-weight:600}
.st-skeleton{display:block;min-height:14px;border-radius:var(--st-radius-xs);background:linear-gradient(90deg,var(--st-n-100) 0,var(--st-n-50) 50%,var(--st-n-100) 100%);background-size:200% 100%;animation:st-skeleton 1.4s linear infinite}
@keyframes st-skeleton{from{background-position:100% 0}to{background-position:-100% 0}}
.st-status{display:inline-flex;align-items:baseline;gap:8px;margin:0;color:var(--st-n-700);font-size:14px;line-height:22px}
.st-status::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--st-n-400);transform:translateY(-1px)}
.st-status-series::before{background:var(--st-success)}
.st-status-catalog::before{background:var(--st-blue-600)}
.st-status-request::before{background:var(--st-focus-light)}
.st-status :is(b,strong){color:var(--st-n-900);font-weight:600}

/* —— Data text: units never transformed; tabular numbers; part numbers in mono —— */
.st-unit{display:block;margin-top:2px;color:var(--st-text-muted);font-size:12px;font-weight:500;letter-spacing:0;text-transform:none}
.st-num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.st-code{font-family:var(--st-mono);font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;overflow-wrap:anywhere}
.st-footnote{margin:8px 0 0;color:var(--st-text-muted);font-size:13px;line-height:20px}

/* —— Form field: visible label + control —— */
.st-field{display:grid;gap:6px;min-width:0}
.st-field>:is(label,span){color:var(--st-n-900);font-size:13px;font-weight:600;line-height:1.3}
.st-field :is(input,select,textarea){width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--st-n-300);border-radius:var(--st-radius-sm);color:var(--st-n-900);background:var(--st-n-0);font:inherit;font-size:15px}
.st-field :is(input,select,textarea):hover{border-color:var(--st-n-400)}
.st-field :is(input,select,textarea):focus{border-color:var(--st-blue-600)}
.st-field :is(input,textarea)::placeholder{color:var(--st-text-muted);opacity:1}

/* —— Table: sentence-case headers with a separate .st-unit line, n-200 rules only —— */
.st-table{width:100%;border-collapse:collapse;font-size:14px}
.st-table th{padding:10px 16px;border-bottom:1px solid var(--st-n-200);color:var(--st-n-600);background:var(--st-n-50);font-size:12px;font-weight:600;line-height:16px;text-align:left;vertical-align:bottom}
.st-table td{height:44px;padding:0 16px;border-bottom:1px solid var(--st-n-200);color:var(--st-n-700);font-variant-numeric:tabular-nums}
.st-table tbody tr:hover>*{background:var(--st-blue-100)}
.st-table :is(.st-num,.r){text-align:right}
.st-table-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--st-n-200);border-radius:var(--st-radius-md)}

/* —— Dark surface (home hero, data band, CTA band, footer only) —— */
.st-dark{color:var(--st-n-0);background:linear-gradient(135deg,var(--st-surface-darkest),var(--st-surface-dark))}
.st-dark :focus-visible{outline-color:var(--st-focus-dark)}

@media(max-width:1050px){
  .st-disclosure-title{font-size:16px;line-height:23px}
}
@media(max-width:680px){
  .st-disclosure-title{font-size:15px;line-height:22px}
  .st-breadcrumb li{display:none}
  .st-breadcrumb li:nth-last-child(2){display:inline-flex}
  .st-breadcrumb li:nth-last-child(2)::before{content:"‹";margin:0 6px 0 0}
}
@media print{
  .st-disclosure::details-content{display:contents;content-visibility:visible}
  .st-disclosure-title::after{display:none}
}

/* —— 减少动效（验收项，不可省略） —— */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
