/**
 * Zermatt Biotech — Design Tokens
 * 单一信息源：所有页面 / 组件引用这里的变量，不要硬编码
 * 全部映射自 Web Design Brief §0.1-0.3
 */

:root {
  /* === Brand Colors === */
  --zb-brand-deep:    #1F4E8C;  /* Primary brand, headlines, primary buttons */
  --zb-brand-mid:     #2E86C1;  /* Secondary brand, gradient mid-stop, links */
  --zb-brand-sky:     #7FD0E8;  /* Accent, network edges, hover glows */
  --zb-brand-ice:     #D6EEF7;  /* Tinted section backgrounds */

  /* === Surface === */
  --zb-surface-white: #FFFFFF;
  --zb-surface-soft:  #F4F7FA;

  /* === Text === */
  --zb-ink-primary:   #0F1B2D;  /* Body text */
  --zb-ink-secondary: #6B7B8C;  /* Captions, subtext, nav links */

  /* === Border / Divider === */
  --zb-border-subtle: #E5EBF0;

  /* === Semantic === */
  --zb-success:       #10B981;

  /* === Gradient (primary buttons, hero accents) === */
  --zb-grad-primary:  linear-gradient(135deg, #1F4E8C 0%, #2E86C1 100%);

  /* === Glow shadows === */
  --zb-shadow-card-hover: 0 0 0 1px var(--zb-brand-sky), 0 0 20px rgba(127, 208, 232, 0.25);
  --zb-shadow-btn-hover:  0 6px 16px rgba(46, 134, 193, 0.30);
  --zb-shadow-focus:      0 0 0 2px var(--zb-brand-mid), 0 0 0 4px rgba(46, 134, 193, 0.20);

  /* === Typography === */
  --zb-font-display: 'Inter', 'Inter Display', -apple-system, BlinkMacSystemFont, sans-serif;
  --zb-font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --zb-font-mono:    'JetBrains Mono', 'SF Mono', 'Menlo', monospace;

  /* === Type Scale === */
  --zb-h1-size: 56px;  --zb-h1-lh: 64px;
  --zb-h2-size: 40px;  --zb-h2-lh: 48px;
  --zb-h3-size: 28px;  --zb-h3-lh: 36px;
  --zb-h4-size: 20px;  --zb-h4-lh: 28px;
  --zb-body-size: 16px; --zb-body-lh: 26px;
  --zb-caption-size: 13px; --zb-caption-lh: 20px;
  --zb-mono-size: 14px; --zb-mono-lh: 22px;

  --zb-tracking-tight: -0.02em;

  /* === Layout === */
  --zb-max-width:        1200px;
  --zb-grid-gutter:      32px;
  --zb-section-pad-y:    120px;  /* desktop */
  --zb-section-pad-y-md: 80px;   /* tablet */
  --zb-section-pad-y-sm: 56px;   /* mobile */

  /* === Radius === */
  --zb-radius-card:   12px;
  --zb-radius-btn:    8px;
  --zb-radius-pill:   999px;

  /* === Spacing scale (4px base) === */
  --zb-sp-1: 4px;
  --zb-sp-2: 8px;
  --zb-sp-3: 12px;
  --zb-sp-4: 16px;
  --zb-sp-5: 20px;
  --zb-sp-6: 24px;
  --zb-sp-8: 32px;
  --zb-sp-10: 40px;
  --zb-sp-12: 48px;
  --zb-sp-16: 64px;
  --zb-sp-20: 80px;
  --zb-sp-24: 96px;

  /* === Motion === */
  --zb-ease:        cubic-bezier(0.4, 0, 0.2, 1);
  --zb-dur-fast:    160ms;
  --zb-dur:         260ms;
  --zb-dur-slow:    480ms;

  /* === Nav === */
  --zb-nav-height: 72px;
}

/* Respect prefers-reduced-motion globally */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}