/*
Theme Name:   Simbatch Public Child
Theme URI:    https://simbatch.example/staging
Description:  Simbatch Public Website V3 子主题（Astra child）。Simbatch Design System Foundation V1：暖白基底、深藏青文字、Simbatch Teal 强调。仅用于隔离 staging，未经批准不得发布到 production。
Author:       Simbatch
Template:     astra
Version:      4.0.0
Text Domain:  simbatch-public-child
*/

/* =========================================================
   1. Design Tokens — Simbatch Design System Foundation V1
   V3 语义层位于本 :root 尾部；V2 名称保留为兼容别名。
   ========================================================= */
:root {
  /* ---------- 1.1 Color 原色 ---------- */
  /* 品牌基底 */
  --sbx-bg:            #F8FAF8;  /* Warm White 页面背景 */
  --sbx-surface:       #FFFFFF;  /* 卡片 / 面板 */
  --sbx-navy-900:      #0D1730;  /* 最深藏青（footer hover 等） */
  --sbx-navy-800:      #14213D;  /* Deep Navy 主文字 / footer */
  --sbx-navy-700:      #1F3057;  /* 深藏青次级 */
  --sbx-text:          #14213D;  /* Primary Text */
  --sbx-text-secondary:#52606D;  /* Secondary Text */
  --sbx-text-invert:   #F4F7FA;  /* 深色底上的文字 */

  /* 品牌强调 */
  --sbx-teal-500:      #159A9C;  /* Simbatch Teal：图形/边框/图标/大字号 */
  --sbx-teal-600:      #0E7A7C;  /* 文字级 teal（白字按钮底、链接，AA 达标） */
  --sbx-teal-700:      #0B5F61;  /* hover 深化 */
  --sbx-teal-300:      #7FC9CA;  /* 深色底文字级 teal（navy 800 上 ≈8.4:1） */
  --sbx-teal-200:      #A8DCDD;  /* 深色底 hover 提亮（navy 800 上 ≈10.6:1） */
  --sbx-teal-100:      #DFF1F1;  /* teal 淡底 */

  /* Soft 色板（区块与语义底色） */
  --sbx-soft-blue:     #E8F1F5;
  --sbx-soft-green:    #E7F4EF;
  --sbx-soft-yellow:   #FFF4D6;
  --sbx-soft-gray:     #EEF2F3;

  /* 中性 */
  --sbx-border:        #E3E9EC;
  --sbx-border-strong: #CBD5DC;
  --sbx-border-input:  #6C7A87;   /* 表单控件边框（M-05：白底 ≥3:1） */
  --sbx-stripe:        #E5EAEC;   /* 样例占位斜纹 */

  /* 透明层（H-03：rgba 不得散落组件层） */
  --sbx-header-bg:     rgba(255, 255, 255, 0.88);
  --sbx-hero-glow-teal: rgba(21, 154, 156, 0.10);
  --sbx-hero-glow-blue: rgba(232, 241, 245, 0.9);

  /* 强调底上的前景（按钮白字等） */
  --sbx-on-accent:     #FFFFFF;

  /* 深色（navy）底上的层级前景（H-03 R5：Dark Surface Matrix 语义层） */
  --sbx-footer-heading: var(--sbx-teal-300); /* navy 底栏目标题/kicker */
  --sbx-footer-text:   #C7D0DC;   /* navy 底链接/正文 */
  --sbx-footer-soft:   #B9C4D3;   /* navy 底次级文字 */
  --sbx-footer-muted:  #96A3B2;   /* navy 底弱化文字（navy-700 ≥4.5:1） */
  --sbx-footer-divider: rgba(199, 208, 220, 0.2); /* 装饰性分隔线（非控件边界） */
  --sbx-code-text:     #C9E8E5;   /* 代码块文字 */
  --sbx-link-on-dark:       var(--sbx-teal-300); /* 深色表面链接/文字按钮 */
  --sbx-link-on-dark-hover: var(--sbx-teal-200); /* 深色表面链接 hover */

  /* 触控目标（M-05：按钮与 Header 控件最小 44px） */
  --sbx-touch-target:  44px;

  /* ---------- H-06 组件间距 / 尺寸 token ---------- */
  --sbx-btn-pad:       0.65rem 1.4rem;   /* 按钮内边距 */
  --sbx-btn-pad-text:  0.5rem;           /* 文字按钮横向内边距 */
  --sbx-nav-pad:       0.5rem 0.85rem;   /* 导航链接内边距 */
  --sbx-nav-pad-m:     0.7rem 0.85rem;   /* 移动导航链接内边距 */
  --sbx-burger-pad:    0.45rem 0.75rem;  /* 汉堡按钮内边距 */
  --sbx-input-pad:     0.65rem 0.85rem;  /* 表单控件内边距 */
  --sbx-cta-pad-x:     1.1rem;           /* Header CTA 横向内边距 */
  --sbx-logo-size:     26px;             /* Logo 图标尺寸 */
  --sbx-svg-stroke-w:  2.4;              /* Logo SVG 描边宽（unitless user units） */
  --sbx-svg-rx:        8px;              /* Logo SVG 圆角（user units） */
  --sbx-caret-size:    9px;              /* 下拉箭头尺寸 */
  --sbx-dot-size:      0.5em;            /* 徽章圆点 */
  --sbx-gap-inline-xs: 0.35em;           /* 行内图文间距（窄） */
  --sbx-gap-inline-sm: 0.4em;            /* 行内图文间距（小） */
  --sbx-gap-inline-md: 0.45em;           /* 行内图文间距（中） */
  --sbx-gap-inline:    0.5em;            /* 行内图文间距（标准） */
  --sbx-pad-tag:       0 0.55em;         /* 标签 pill 内边距 */
  --sbx-pad-badge:     0.28em 0.85em;    /* 徽章内边距 */
  --sbx-pad-chip:      0.18em 0.75em;    /* chip 内边距 */
  --sbx-msg-min-h:     1.5em;            /* 表单消息最小高 */
  --sbx-focus-ring-offset: 2px;          /* 焦点环偏移 */
  --sbx-dropdown-min-w: 260px;           /* 下拉浮层最小宽 */
  --sbx-dropdown-gap:  6px;              /* 下拉与触发器间距 */
  --sbx-table-min-w:   640px;            /* 表格横滚阈值 */
  --sbx-sample-min-h:  110px;            /* 样例可视区最小高 */
  --sbx-timeline-dot:  14px;             /* 时间线节点直径 */
  --sbx-timeline-line: 2px;              /* 时间线纵线宽 */
  --sbx-timeline-inset: 6px;             /* 时间线纵线/节点定位偏移 */
  --sbx-measure-hero:  62rem;            /* Hero 版心 */
  --sbx-measure-lead:  44em;             /* Hero lead 行长 */
  --sbx-measure-text:  52em;             /* Section lead 行长 */
  --sbx-measure-body:  60em;             /* 正文行长 */
  --sbx-measure-block: 56rem;            /* FAQ/Evidence 块宽 */
  --sbx-measure-form:  34rem;            /* 表单宽 */
  --sbx-measure-brand: 30ch;             /* Footer 品牌段行长 */

  /* ---------- R6 H-05：运动/滤镜/渐变几何 token（default-deny 治理面） ---------- */
  --sbx-transition-fast: 0.15s ease;     /* 全站唯一过渡节奏（≤150ms 规则） */
  --sbx-hover-lift:    -2px;             /* 卡片 hover 上浮位移 */
  --sbx-caret-angle:   45deg;            /* 下拉 caret 旋转角 */
  --sbx-caret-shift:   -2px;             /* 下拉 caret 光学对齐位移 */
  --sbx-opacity-dim:   0.65;             /* 弱化图形透明度（caret） */
  --sbx-opacity-soft:  0.75;             /* 次级小字透明度（样例 pane） */
  --sbx-header-blur:   12px;             /* Header 毛玻璃模糊半径 */
  --sbx-header-saturate: 1.4;            /* Header 毛玻璃饱和度 */
  --sbx-hero-glow-size-a: 900px 420px;   /* Hero 柔光晕 A 尺寸 */
  --sbx-hero-glow-size-b: 700px 380px;   /* Hero 柔光晕 B 尺寸 */
  --sbx-stripe-angle:  45deg;            /* 样例占位斜纹角度 */
  --sbx-stripe-step-a: 8px;              /* 斜纹步长 A */
  --sbx-stripe-step-b: 16px;             /* 斜纹步长 B */
  --sbx-grad-angle-fade: 180deg;         /* 卡片渐入角度 */
  --sbx-grad-angle-tilt: 160deg;         /* 样例 after 渐变角度 */

  /* ---------- 1.2 语义色 ---------- */
  --sbx-color-bg:            var(--sbx-bg);
  --sbx-color-bg-alt:        var(--sbx-soft-gray);
  --sbx-color-surface:       var(--sbx-surface);
  --sbx-color-border:        var(--sbx-border);
  --sbx-color-text:          var(--sbx-text);
  --sbx-color-text-muted:    var(--sbx-text-secondary);
  --sbx-color-text-invert:   var(--sbx-text-invert);
  --sbx-color-accent:        var(--sbx-teal-500);
  --sbx-color-accent-strong: var(--sbx-teal-600);
  --sbx-color-link:          var(--sbx-teal-600);
  /* H-05 焦点系统：三态 token，全部对相邻表面 ≥3:1（见 contrast-check）
     light = 浅色底；dark = navy 底；brand = teal 品牌面 */
  --sbx-focus-light:         var(--sbx-teal-600);
  --sbx-focus-dark:          var(--sbx-footer-heading);
  --sbx-focus-brand:         var(--sbx-navy-800);
  --sbx-color-focus:         var(--sbx-focus-light);
  --sbx-focus-ring-w:        3px;

  /* ---------- 1.3 状态色（public_product_status 五态 + 占位） ----------
     available      → soft green   internal_pilot → soft gray
     early_access   → soft blue    in_development → soft yellow
     roadmap        → soft gray（虚线边）  pending 占位 → soft yellow */
  --sbx-status-available-bg:     var(--sbx-soft-green);
  --sbx-status-available-text:   #116149;
  --sbx-status-early-bg:         var(--sbx-soft-blue);
  --sbx-status-early-text:       #1D4E6B;
  --sbx-status-dev-bg:           var(--sbx-soft-yellow);
  --sbx-status-dev-text:         #7A5A00;
  --sbx-status-pilot-bg:         var(--sbx-soft-gray);
  --sbx-status-pilot-text:       #3D4C59;
  --sbx-status-roadmap-bg:       var(--sbx-soft-gray);
  --sbx-status-roadmap-text:     #52606D;
  --sbx-status-pending-bg:       var(--sbx-soft-yellow);
  --sbx-status-pending-text:     #7A5A00;

  /* ---------- 1.4 Typography ---------- */
  --sbx-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
                   "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
                   "Noto Sans SC", sans-serif;
  --sbx-font-mono: ui-monospace, "Cascadia Code", Consolas, "Courier New", monospace;

  --sbx-text-hero: clamp(2.375rem, 5vw, 3.5rem);   /* Hero Title */
  --sbx-text-h1:   clamp(2rem, 4vw, 2.75rem);      /* H1 */
  --sbx-text-h2:   clamp(1.5rem, 2.6vw, 2rem);     /* H2 */
  --sbx-text-h3:   1.25rem;                        /* H3 */
  --sbx-text-body: 1rem;                           /* Body */
  --sbx-text-lg:   1.125rem;                       /* Lead / 强调正文 */
  --sbx-text-lead: clamp(1rem, 2vw, 1.25rem);      /* Hero lead */
  --sbx-text-sm:   0.875rem;                       /* Small Text（状态文字桌面下限 14px） */
  --sbx-text-sm-mobile: 0.8125rem;                 /* 状态文字移动下限 13px */
  --sbx-text-label:0.75rem;                        /* Label（大写 + 字距） */

  --sbx-leading-tight: 1.15;
  --sbx-leading-snug:  1.3;
  --sbx-leading-normal: 1.5;
  --sbx-leading-relaxed: 1.6;
  --sbx-leading-body:  1.7;

  /* ---------- 1.5 Spacing ---------- */
  --sbx-space-1: 0.25rem;
  --sbx-space-2: 0.5rem;
  --sbx-space-3: 0.75rem;
  --sbx-space-4: 1rem;
  --sbx-space-5: 1.5rem;
  --sbx-space-6: 2rem;
  --sbx-space-7: 3rem;
  --sbx-space-8: 4rem;
  --sbx-space-9: 6rem;
  --sbx-section-y: clamp(4rem, 8vw, 6.5rem);   /* Section 垂直节奏 */
  --sbx-card-pad:  clamp(1.25rem, 2.5vw, 2rem);/* 卡片内边距 */

  /* ---------- 1.6 Radius ---------- */
  --sbx-radius-sm:   8px;
  --sbx-radius-md:   12px;
  --sbx-radius-lg:   16px;
  --sbx-radius-xl:   24px;
  --sbx-radius-pill: 999px;

  /* ---------- 1.7 Shadow（柔和、低饱和） ---------- */
  --sbx-shadow-xs: 0 1px 2px rgba(20, 33, 61, 0.05);
  --sbx-shadow-sm: 0 1px 3px rgba(20, 33, 61, 0.06), 0 4px 12px rgba(20, 33, 61, 0.05);
  --sbx-shadow-md: 0 4px 12px rgba(20, 33, 61, 0.07), 0 12px 32px rgba(20, 33, 61, 0.07);
  --sbx-shadow-lg: 0 8px 24px rgba(20, 33, 61, 0.09), 0 24px 56px rgba(20, 33, 61, 0.10);
  --sbx-ring-accent: 0 0 0 2px var(--sbx-teal-500); /* 时间线节点描环 */

  /* ---------- 1.8 Layout ----------
     断点：Desktop 1440 / Tablet 768 / Mobile 390（CSS px） */
  --sbx-container:      1200px;
  --sbx-container-wide: 1360px;
  --sbx-container-pad:  clamp(1rem, 4vw, 2rem);
  --sbx-header-h:       68px;
  --sbx-grid-gap:       clamp(1rem, 2vw, 1.5rem);

  /* =======================================================
     V3 Design System Foundation V1
     Primitive → Semantic → Component
     权威来源：docs/design-system/SIMBATCH_DESIGN_TOKENS_FOUNDATION_V1.md
     ======================================================= */

  /* ---------- Primitive: color ---------- */
  --sbx-color-white:       #FFFFFF;
  --sbx-color-warm-25:     #F8FAF8;
  --sbx-color-neutral-50:  #F5F7F7;
  --sbx-color-neutral-100: #EEF2F3;
  --sbx-color-neutral-200: #E3E9EC;
  --sbx-color-neutral-300: #CBD5DA;
  --sbx-color-neutral-400: #8C9AA5;
  --sbx-color-neutral-500: #687784;
  --sbx-color-neutral-600: #52606D;
  --sbx-color-neutral-700: #3D4C59;
  --sbx-color-navy-700:    #243451;
  --sbx-color-navy-800:    #14213D;
  --sbx-color-navy-900:    #0D172B;
  --sbx-color-teal-100:    #D9F0F0;
  --sbx-color-teal-200:    #A8DCDD;
  --sbx-color-teal-300:    #7FC9CA;
  --sbx-color-teal-500:    #159A9C;
  --sbx-color-teal-600:    #0E7A7C;
  --sbx-color-teal-700:    #0B5F61;
  --sbx-color-teal-800:    #084B4D;
  --sbx-color-signal-info-bg:      #E8F1F5;
  --sbx-color-signal-info-text:    #1D4E6B;
  --sbx-color-signal-success-bg:   #E7F4EF;
  --sbx-color-signal-success-text: #116149;
  --sbx-color-signal-warning-bg:   #FFF4D6;
  --sbx-color-signal-warning-text: #7A5A00;
  --sbx-color-signal-danger-bg:    #FDEBEC;
  --sbx-color-signal-danger-text:  #8B2F3D;

  /* ---------- Semantic: color ---------- */
  --sbx-color-background-canvas:        var(--sbx-color-warm-25);
  --sbx-color-background-subtle:        var(--sbx-color-neutral-50);
  --sbx-color-background-brand-subtle:  var(--sbx-color-teal-100);
  --sbx-color-surface-default:           var(--sbx-color-white);
  --sbx-color-surface-muted:             var(--sbx-color-neutral-100);
  --sbx-color-surface-inverse:           var(--sbx-color-navy-800);
  --sbx-color-surface-inverse-strong:    var(--sbx-color-navy-900);
  --sbx-color-text-primary:              var(--sbx-color-navy-800);
  --sbx-color-text-secondary:            var(--sbx-color-neutral-600);
  --sbx-color-text-tertiary:             var(--sbx-color-neutral-500);
  --sbx-color-text-inverse:              var(--sbx-color-white);
  --sbx-color-text-inverse-secondary:    var(--sbx-color-teal-200);
  --sbx-color-text-brand:                var(--sbx-color-teal-700);
  --sbx-color-action-primary-bg:         var(--sbx-color-teal-600);
  --sbx-color-action-primary-bg-hover:   var(--sbx-color-teal-700);
  --sbx-color-action-primary-text:       var(--sbx-color-white);
  --sbx-color-action-secondary-bg:       var(--sbx-color-white);
  --sbx-color-action-secondary-bg-hover: var(--sbx-color-neutral-50);
  --sbx-color-action-secondary-text:     var(--sbx-color-navy-800);
  --sbx-color-action-link:               var(--sbx-color-teal-700);
  --sbx-color-action-link-hover:         var(--sbx-color-teal-800);
  --sbx-color-action-link-inverse:       var(--sbx-color-teal-300);
  --sbx-color-action-link-inverse-hover: var(--sbx-color-teal-200);
  --sbx-color-border-subtle:             var(--sbx-color-neutral-200);
  --sbx-color-border-default:            var(--sbx-color-neutral-300);
  --sbx-color-border-strong:             var(--sbx-color-neutral-500);
  --sbx-color-border-brand:              var(--sbx-color-teal-600);
  --sbx-color-focus-light:               var(--sbx-color-teal-600);
  --sbx-color-focus-dark:                var(--sbx-color-teal-200);

  /* ---------- Primitive and semantic: typography ---------- */
  --sbx-type-family-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
                          "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
                          "Noto Sans SC", sans-serif;
  --sbx-type-family-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --sbx-type-weight-regular:  400;
  --sbx-type-weight-medium:   500;
  --sbx-type-weight-semibold: 600;
  --sbx-type-weight-bold:     700;
  --sbx-type-display-1-size: clamp(3rem, 6vw, 5.5rem);
  --sbx-type-display-1-line: 1.02;
  --sbx-type-display-2-size: clamp(2.5rem, 5vw, 4.5rem);
  --sbx-type-display-2-line: 1.06;
  --sbx-type-heading-1-size: clamp(2.25rem, 4vw, 3.75rem);
  --sbx-type-heading-1-line: 1.10;
  --sbx-type-heading-2-size: clamp(1.75rem, 3vw, 2.75rem);
  --sbx-type-heading-2-line: 1.16;
  --sbx-type-heading-3-size: clamp(1.375rem, 2vw, 1.875rem);
  --sbx-type-heading-3-line: 1.24;
  --sbx-type-heading-4-size: 1.125rem;
  --sbx-type-heading-4-line: 1.35;
  --sbx-type-body-lead-size: clamp(1.125rem, 1.5vw, 1.3125rem);
  --sbx-type-body-lead-line: 1.65;
  --sbx-type-body-size:       1rem;
  --sbx-type-body-line:       1.70;
  --sbx-type-body-small-size: 0.875rem;
  --sbx-type-body-small-line: 1.60;
  --sbx-type-label-size:      0.75rem;
  --sbx-type-label-line:      1.40;
  --sbx-type-code-size:       0.875rem;
  --sbx-type-code-line:       1.65;
  --sbx-type-tracking-display: -0.025em;
  --sbx-type-tracking-heading: -0.015em;
  --sbx-type-tracking-body:     0;
  --sbx-type-tracking-label:    0.08em;
  --sbx-type-measure-heading: 20ch;
  --sbx-type-measure-lead:    48ch;
  --sbx-type-measure-body:    68ch;
  --sbx-type-measure-wide:    80ch;

  /* ---------- Primitive and semantic: spacing ---------- */
  --sbx-space-0:  0;
  --sbx-space-1:  0.25rem;
  --sbx-space-2:  0.5rem;
  --sbx-space-3:  0.75rem;
  --sbx-space-4:  1rem;
  --sbx-space-5:  1.25rem;
  --sbx-space-6:  1.5rem;
  --sbx-space-8:  2rem;
  --sbx-space-10: 2.5rem;
  --sbx-space-12: 3rem;
  --sbx-space-16: 4rem;
  --sbx-space-20: 5rem;
  --sbx-space-24: 6rem;
  --sbx-space-32: 8rem;
  --sbx-space-inline-xs: var(--sbx-space-1);
  --sbx-space-inline-sm: var(--sbx-space-2);
  --sbx-space-inline-md: var(--sbx-space-3);
  --sbx-space-inline-lg: var(--sbx-space-4);
  --sbx-space-stack-xs:  var(--sbx-space-2);
  --sbx-space-stack-sm:  var(--sbx-space-3);
  --sbx-space-stack-md:  var(--sbx-space-4);
  --sbx-space-stack-lg:  var(--sbx-space-6);
  --sbx-space-stack-xl:  var(--sbx-space-8);
  --sbx-space-grid:            clamp(1rem, 2vw, 2rem);
  --sbx-space-section-block:   clamp(4rem, 8vw, 7.5rem);
  --sbx-space-section-compact: clamp(2.5rem, 5vw, 4.5rem);
  --sbx-space-page-gutter:     clamp(1rem, 3vw, 2.5rem);

  /* ---------- Shape, border, elevation ---------- */
  --sbx-radius-none: 0;
  --sbx-radius-sm:   0.5rem;
  --sbx-radius-md:   0.75rem;
  --sbx-radius-lg:   1rem;
  --sbx-radius-xl:   1.5rem;
  --sbx-radius-full: 999rem;
  --sbx-border-width-default:      1px;
  --sbx-border-width-strong:       2px;
  --sbx-border-width-relationship: 2px;
  --sbx-elevation-none:   none;
  --sbx-elevation-low:    0 1px 3px rgba(20, 33, 61, 0.06), 0 4px 12px rgba(20, 33, 61, 0.05);
  --sbx-elevation-medium: 0 4px 12px rgba(20, 33, 61, 0.07), 0 12px 32px rgba(20, 33, 61, 0.07);
  --sbx-elevation-high:   0 8px 24px rgba(20, 33, 61, 0.09), 0 24px 56px rgba(20, 33, 61, 0.10);

  /* ---------- Layout and breakpoint reference tokens ---------- */
  --sbx-layout-container-prose:   45rem;
  --sbx-layout-container-compact: 60rem;
  --sbx-layout-container-content: 75rem;
  --sbx-layout-container-wide:    90rem;
  --sbx-layout-grid-compact:   4;
  --sbx-layout-grid-medium:    8;
  --sbx-layout-grid-wide:     12;
  --sbx-breakpoint-compact-max:  37.499rem;
  --sbx-breakpoint-medium-min:   37.5rem;
  --sbx-breakpoint-wide-min:     64rem;
  --sbx-breakpoint-expanded-min: 90rem;

  /* ---------- Motion and media ---------- */
  --sbx-motion-duration-instant:  80ms;
  --sbx-motion-duration-fast:     150ms;
  --sbx-motion-duration-standard: 240ms;
  --sbx-motion-duration-slow:     400ms;
  --sbx-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --sbx-motion-easing-enter:    cubic-bezier(0, 0, 0.2, 1);
  --sbx-motion-easing-exit:     cubic-bezier(0.4, 0, 1, 1);
  --sbx-motion-easing-linear:   linear;
  --sbx-media-ratio-square:     1 / 1;
  --sbx-media-ratio-landscape: 4 / 3;
  --sbx-media-ratio-wide:      16 / 9;
  --sbx-media-ratio-editorial:  3 / 2;

  /* ---------- Component aliases ---------- */
  --sbx-hero-title-max-width:   var(--sbx-type-measure-heading);
  --sbx-hero-lead-max-width:    var(--sbx-type-measure-lead);
  --sbx-component-card-padding: clamp(1.25rem, 2.5vw, 2rem);
  --sbx-component-card-gap:     var(--sbx-space-stack-md);
  --sbx-component-card-border:  var(--sbx-color-border-subtle);
  --sbx-component-card-surface: var(--sbx-color-surface-default);
  --sbx-architecture-connector: var(--sbx-color-border-brand);
  --sbx-architecture-node-bg:   var(--sbx-color-surface-default);
  --sbx-architecture-memory-bg: var(--sbx-color-background-brand-subtle);
  --sbx-evidence-limit-bg:      var(--sbx-color-signal-warning-bg);
  --sbx-sample-artifact-bg:     var(--sbx-color-background-subtle);
  --sbx-cta-surface:            var(--sbx-color-surface-default);

  /* ---------- V2 compatibility aliases mapped to V3 ---------- */
  --sbx-bg:              var(--sbx-color-background-canvas);
  --sbx-surface:         var(--sbx-color-surface-default);
  --sbx-navy-900:        var(--sbx-color-navy-900);
  --sbx-navy-800:        var(--sbx-color-navy-800);
  --sbx-navy-700:        var(--sbx-color-navy-700);
  --sbx-text:            var(--sbx-color-text-primary);
  --sbx-text-secondary:  var(--sbx-color-text-secondary);
  --sbx-text-invert:     var(--sbx-color-text-inverse);
  --sbx-teal-100:        var(--sbx-color-teal-100);
  --sbx-teal-200:        var(--sbx-color-teal-200);
  --sbx-teal-300:        var(--sbx-color-teal-300);
  --sbx-teal-500:        var(--sbx-color-teal-500);
  --sbx-teal-600:        var(--sbx-color-teal-600);
  --sbx-teal-700:        var(--sbx-color-teal-700);
  --sbx-soft-blue:       var(--sbx-color-signal-info-bg);
  --sbx-soft-green:      var(--sbx-color-signal-success-bg);
  --sbx-soft-yellow:     var(--sbx-color-signal-warning-bg);
  --sbx-soft-gray:       var(--sbx-color-surface-muted);
  --sbx-border:          var(--sbx-color-border-subtle);
  --sbx-border-strong:   var(--sbx-color-border-default);
  --sbx-on-accent:       var(--sbx-color-action-primary-text);
  --sbx-font-sans:       var(--sbx-type-family-sans);
  --sbx-font-mono:       var(--sbx-type-family-mono);
  --sbx-text-hero:       var(--sbx-type-heading-1-size);
  --sbx-text-h1:         var(--sbx-type-heading-1-size);
  --sbx-text-h2:         var(--sbx-type-heading-2-size);
  --sbx-text-h3:         var(--sbx-type-heading-3-size);
  --sbx-text-body:       var(--sbx-type-body-size);
  --sbx-text-lg:         var(--sbx-type-body-lead-size);
  --sbx-text-lead:       var(--sbx-type-body-lead-size);
  --sbx-text-sm:         var(--sbx-type-body-small-size);
  --sbx-text-label:      var(--sbx-type-label-size);
  --sbx-leading-tight:   var(--sbx-type-heading-1-line);
  --sbx-leading-snug:    var(--sbx-type-heading-3-line);
  --sbx-leading-normal:  var(--sbx-type-body-line);
  --sbx-leading-relaxed: var(--sbx-type-body-small-line);
  --sbx-leading-body:    var(--sbx-type-body-line);
  --sbx-space-7:         var(--sbx-space-12);
  --sbx-space-9:         var(--sbx-space-24);
  --sbx-section-y:       var(--sbx-space-section-block);
  --sbx-card-pad:        var(--sbx-component-card-padding);
  --sbx-radius-pill:     var(--sbx-radius-full);
  --sbx-shadow-sm:       var(--sbx-elevation-low);
  --sbx-shadow-md:       var(--sbx-elevation-medium);
  --sbx-shadow-lg:       var(--sbx-elevation-high);
  --sbx-container:       var(--sbx-layout-container-content);
  --sbx-container-wide:  var(--sbx-layout-container-wide);
  --sbx-container-pad:   var(--sbx-space-page-gutter);
  --sbx-grid-gap:        var(--sbx-space-grid);
  --sbx-transition-fast: var(--sbx-motion-duration-fast) var(--sbx-motion-easing-standard);
  --sbx-color-bg:        var(--sbx-color-background-canvas);
  --sbx-color-bg-alt:    var(--sbx-color-background-subtle);
  --sbx-color-surface:   var(--sbx-color-surface-default);
  --sbx-color-border:    var(--sbx-color-border-subtle);
  --sbx-color-text:      var(--sbx-color-text-primary);
  --sbx-color-text-muted:var(--sbx-color-text-secondary);
  --sbx-color-text-invert:var(--sbx-color-text-inverse);
  --sbx-color-link:      var(--sbx-color-action-link);
  --sbx-color-focus:     var(--sbx-color-focus-light);
}

/* =========================================================
   2. 基础
   ========================================================= */
html { scroll-behavior: smooth; }
body {
  font-family: var(--sbx-font-sans);
  font-size: var(--sbx-text-body);
  line-height: var(--sbx-leading-body);
  color: var(--sbx-color-text);
  background: var(--sbx-color-bg);
  overflow-x: hidden; /* 防御性：页面不得横向溢出 */
  -webkit-font-smoothing: antialiased;
}
.sbx-container {
  max-width: var(--sbx-container);
  margin-inline: auto;
  padding-inline: var(--sbx-container-pad);
}
.sbx-container--wide { max-width: var(--sbx-container-wide); }

/* 键盘焦点：统一可见 focus ring */
a:focus-visible,
button:focus-visible,
.sbx-site input:focus-visible,
.sbx-site select:focus-visible,
.sbx-site textarea:focus-visible,
.sbx-site summary:focus-visible {
  outline: var(--sbx-focus-ring-w) solid var(--sbx-color-focus);
  outline-offset: var(--sbx-focus-ring-offset);
  border-radius: var(--sbx-radius-sm);
}
/* H-05：深色（navy）表面用 focus-dark；品牌（teal）控件用 focus-brand */
.sbx-footer a:focus-visible,
.sbx-section--navy a:focus-visible,
.sbx-section--navy button:focus-visible,
.sbx-datasample pre:focus-visible {
  outline-color: var(--sbx-focus-dark);
}
.sbx-btn--primary:focus-visible,
.sbx-nav__cta .sbx-nav__link:focus-visible {
  outline-color: var(--sbx-focus-brand);
  /* H-05：focus 态钉住品牌面为 teal-600，禁止 hover 深化叠加——
     使 focus-brand(navy-800) 的相邻面唯一化（3.11:1，contrast-check 有结构断言） */
  background: var(--sbx-teal-600);
}

.sbx-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 10000;
  background: var(--sbx-navy-800);
  color: var(--sbx-on-accent);
  padding: var(--sbx-space-3) var(--sbx-space-5);
  border-radius: 0 0 var(--sbx-radius-md) 0;
}
.sbx-skip-link:focus { left: 0; color: var(--sbx-on-accent); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Logo SVG 外观全部由 token 驱动（H-06：PHP 不含视觉常量） */
.sbx-logo__mark rect {
  fill: var(--sbx-teal-500);
  rx: var(--sbx-svg-rx);
}
.sbx-logo__mark path {
  fill: none;
  stroke: var(--sbx-navy-800);
  stroke-width: var(--sbx-svg-stroke-w);
  stroke-linecap: round; /* R6：字形端点样式由 CSS 承载（枚举关键字） */
}

/* =========================================================
   3. Header — 亮色企业风（sticky、白底、含未来导航扩展位）
   ========================================================= */
.sbx-header {
  position: sticky;
  top: 0;
  z-index: 900;
  background: var(--sbx-header-bg);
  backdrop-filter: saturate(var(--sbx-header-saturate)) blur(var(--sbx-header-blur));
  -webkit-backdrop-filter: saturate(var(--sbx-header-saturate)) blur(var(--sbx-header-blur));
  color: var(--sbx-color-text);
  border-bottom: 1px solid var(--sbx-border);
}
.sbx-header__inner {
  display: flex;
  align-items: center;
  gap: var(--sbx-space-5);
  min-height: var(--sbx-header-h);
}
.sbx-logo {
  display: inline-flex;
  align-items: center;
  gap: var(--sbx-space-2);
  font-weight: 700;
  font-size: var(--sbx-text-lg);
  letter-spacing: -0.01em;
  min-height: var(--sbx-touch-target); /* M-01/H-05：Logo 触控目标 44x44 */
  min-width: var(--sbx-touch-target);
  color: var(--sbx-navy-800);
  text-decoration: none;
  white-space: nowrap;
}
.sbx-logo:hover, .sbx-logo:focus { color: var(--sbx-navy-800); }
.sbx-logo__mark { width: var(--sbx-logo-size); height: var(--sbx-logo-size); flex: none; }
.sbx-logo__tag {
  font-size: var(--sbx-text-label);
  font-weight: 600;
  color: var(--sbx-teal-600);
  border: 1px solid currentColor;
  border-radius: var(--sbx-radius-pill);
  padding: var(--sbx-pad-tag);
  line-height: var(--sbx-leading-body);
}

.sbx-nav { margin-left: auto; }
.sbx-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: var(--sbx-space-1);
}
.sbx-nav__list li { margin: 0; position: relative; }
.sbx-nav__link {
  display: inline-flex;
  align-items: center;
  gap: var(--sbx-gap-inline-xs);
  min-height: var(--sbx-touch-target); /* M-05：Header 控件 ≥44px */
  padding: var(--sbx-nav-pad);
  color: var(--sbx-color-text);
  text-decoration: none;
  font-size: var(--sbx-text-sm);
  font-weight: 500;
  border-radius: var(--sbx-radius-pill);
  transition: background-color var(--sbx-transition-fast), color var(--sbx-transition-fast);
}
.sbx-nav__link:hover,
.sbx-nav__link[aria-current="page"] {
  color: var(--sbx-teal-700);
  background: var(--sbx-soft-blue);
}
.sbx-nav__caret {
  width: var(--sbx-caret-size); height: var(--sbx-caret-size);
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(var(--sbx-caret-angle)) translateY(var(--sbx-caret-shift));
  flex: none;
  opacity: var(--sbx-opacity-dim);
}

/* 下拉子菜单：白色浮层 */
.sbx-nav__sub {
  list-style: none;
  margin: 0;
  padding: var(--sbx-space-2);
  position: absolute;
  top: calc(100% + var(--sbx-dropdown-gap));
  left: 0;
  min-width: var(--sbx-dropdown-min-w);
  background: var(--sbx-surface);
  border: 1px solid var(--sbx-border);
  border-radius: var(--sbx-radius-md);
  box-shadow: var(--sbx-shadow-lg);
  display: none;
}
.sbx-nav__item--open > .sbx-nav__sub { display: block; }
.sbx-nav__sub .sbx-nav__link {
  display: flex;
  width: 100%;
  border-radius: var(--sbx-radius-sm);
}
.sbx-nav__toggle-btn {
  appearance: none;
  background: none;
  border: 0;
  cursor: pointer;
  font: inherit;
}

/* Header CTA */
.sbx-nav__cta .sbx-nav__link {
  background: var(--sbx-teal-600);
  color: var(--sbx-on-accent);
  font-weight: 600;
  padding-inline: var(--sbx-cta-pad-x);
}
.sbx-nav__cta .sbx-nav__link:hover {
  background: var(--sbx-teal-700);
  color: var(--sbx-on-accent);
}

/* 移动端汉堡 */
.sbx-nav__burger {
  display: none;
  margin-left: auto;
  appearance: none;
  background: var(--sbx-surface);
  border: 1px solid var(--sbx-border-input); /* H-05：交互控件边界 >=3:1 */
  border-radius: var(--sbx-radius-sm);
  color: var(--sbx-color-text);
  min-height: var(--sbx-touch-target); /* M-05 */
  min-width: var(--sbx-touch-target);
  padding: var(--sbx-burger-pad);
  font: inherit;
  font-size: var(--sbx-text-sm);
  font-weight: 500;
  cursor: pointer;
}

@media (max-width: 1023px) {
  .sbx-nav__burger { display: inline-flex; align-items: center; gap: var(--sbx-gap-inline-sm); }
  .sbx-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--sbx-surface);
    border-bottom: 1px solid var(--sbx-border);
    box-shadow: var(--sbx-shadow-md);
    max-height: calc(100vh - var(--sbx-header-h));
    overflow-y: auto;
  }
  .sbx-nav--open { display: block; }
  .sbx-nav__list {
    flex-direction: column;
    align-items: stretch;
    padding: var(--sbx-space-4) var(--sbx-container-pad) var(--sbx-space-6);
    gap: var(--sbx-space-1);
  }
  .sbx-nav__link { display: flex; width: 100%; justify-content: flex-start; padding: var(--sbx-nav-pad-m); border-radius: var(--sbx-radius-sm); }
  .sbx-nav__sub {
    position: static;
    display: none;
    box-shadow: none;
    border: 0;
    border-left: 2px solid var(--sbx-teal-500);
    border-radius: 0;
    margin-left: var(--sbx-space-4);
    background: transparent;
  }
  .sbx-nav__item--open > .sbx-nav__sub { display: block; }
}

/* =========================================================
   4. Footer — Deep Navy 品牌锚（五分区 + 唯一版权）
   ========================================================= */
.sbx-footer {
  background: var(--sbx-navy-800);
  color: var(--sbx-color-text-invert);
  margin-top: 0;
}
.sbx-footer__grid {
  display: grid;
  grid-template-columns: 2fr repeat(5, 1fr);
  gap: var(--sbx-space-6);
  padding-block: var(--sbx-space-8);
}
.sbx-footer__brand p {
  color: var(--sbx-footer-soft);
  font-size: var(--sbx-text-sm);
  max-width: var(--sbx-measure-brand);
}
.sbx-footer .sbx-logo,
.sbx-footer .sbx-logo:hover { color: var(--sbx-on-accent); }
/* R5（H-03）：`nav h2` 提升特异性至 (0,1,2)，防止后声明的
   `.sbx-site h2` 基线色（navy-800）在 navy 底上压制栏目标题 */
.sbx-footer nav h2 {
  font-size: var(--sbx-text-label);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--sbx-footer-heading);
  margin: 0 0 var(--sbx-space-4);
}
.sbx-footer ul { list-style: none; margin: 0; padding: 0; }
.sbx-footer li { margin: 0; } /* 行高由 44px 触控目标提供 */
.sbx-footer a {
  display: inline-flex;
  align-items: center;
  min-height: var(--sbx-touch-target); /* M-01/H-05：Footer 链接 44x44 */
  min-width: var(--sbx-touch-target);
  color: var(--sbx-footer-text);
  text-decoration: none;
  font-size: var(--sbx-text-sm);
}
.sbx-footer a:hover { color: var(--sbx-on-accent); }
.sbx-footer__legal {
  border-top: 1px solid var(--sbx-footer-divider);
  padding-block: var(--sbx-space-5);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sbx-space-3);
  justify-content: space-between;
  font-size: var(--sbx-text-sm);
  color: var(--sbx-footer-muted);
}
@media (max-width: 1023px) {
  .sbx-footer__grid { grid-template-columns: repeat(3, 1fr); }
  .sbx-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 599px) {
  .sbx-footer__grid { grid-template-columns: repeat(2, 1fr); }
}

/* =========================================================
   5. 正文排版基线
   ========================================================= */
.sbx-site .entry-content > * { max-width: none; }
.sbx-site h1, .sbx-site h2, .sbx-site h3 {
  color: var(--sbx-navy-800);
  letter-spacing: -0.015em;
}
.sbx-site h1 { font-size: var(--sbx-text-h1); line-height: var(--sbx-leading-tight); }
.sbx-site h2 { font-size: var(--sbx-text-h2); line-height: var(--sbx-leading-snug); }
.sbx-site h3 { font-size: var(--sbx-text-h3); line-height: var(--sbx-leading-snug); }

/* 正文链接色：零特异性包装，组件自身配色优先 */
:where(.sbx-site .entry-content) a { color: var(--sbx-color-link); }

/* 压制 Astra 全局链接下划线对组件的穿透
   （需要 0,2,1 特异性对齐 Astra 的 .ast-single-post .entry-content a） */
.sbx-site .sbx-nav__link,
.sbx-site .sbx-logo,
.sbx-site .entry-content a,
.sbx-site .sbx-workflow__card,
.sbx-footer a {
  text-decoration: none;
}
/* 纯文字段落中的链接保留下划线（可访问性） */
.sbx-site .sbx-timeline__body a,
.sbx-site .sbx-faq__a a,
.sbx-site .sbx-note a {
  text-decoration: underline;
}

/* Astra 容器在本主题下始终全宽，由组件自己控制内边距 */
.sbx-site .site-content .ast-container {
  max-width: none;
  padding: 0;
}
/* 去掉 Astra 内容区默认外边距 */
.sbx-site .content-area,
.sbx-site #primary {
  margin: 0;
  padding: 0;
}
.sbx-site .entry-content p { margin-block: 0 var(--sbx-space-4); }

/* M-7（R4）：长英文 / 长 URL / 无空格字符串必须折行，
   不得依赖 body 的防御性 overflow-x:hidden 掩盖内容溢出。
   （代码块 .sbx-datasample pre 例外：其自身滚动容器合法承载长行） */
.sbx-site .entry-content,
.sbx-site .sbx-card__desc,
.sbx-site .sbx-evidence__body,
.sbx-site .sbx-faq__a,
.sbx-site .sbx-timeline__body {
  overflow-wrap: anywhere;
}