/* PUBLINK.AI · 医疗设备行业 AI 服务解决方案 · design tokens */

@font-face {
  font-family: "Alibaba PuHuiTi";
  src: url("../../fonts/alibaba-puhuiti/AlibabaPuHuiTi-3-55-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Alibaba PuHuiTi";
  src: url("../../fonts/alibaba-puhuiti/AlibabaPuHuiTi-3-75-SemiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Alibaba PuHuiTi";
  src: url("../../fonts/alibaba-puhuiti/AlibabaPuHuiTi-3-95-ExtraBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

:root {
  --font: "Alibaba PuHuiTi", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;

  /* Core palette — all color values live here */
  --color-bg-deep: #06132b;
  --color-navy: #071b4b;
  --color-navy-2: #0d2463;
  --color-navy-3: #132d72;
  --color-ink: #142033;
  --color-text: #24324a;
  --color-muted: #607084;
  --color-input: #8fa3bf;
  --color-line: #d8e0ea;
  --color-line-soft: #e8eef5;
  --color-bg: #f7f9fc;
  --color-bg-alt: #edf3f8;
  --color-white: #ffffff;

  --color-cyan: #13c2c2;
  --color-tech: #4e8dff;
  --color-ai: #7d8cff;
  --color-ai-deep: #5a3dff;
  --color-focus: #4e8dff;
  --color-success: #2db88a;
  --color-error: #d64545;

  /* Gradients */
  --gradient-brand: linear-gradient(90deg, #13c2c2 0%, #4e8dff 55%, #7d8cff 100%);
  --gradient-title: linear-gradient(90deg, #13c2c2 0%, #4e8dff 52%, #7d8cff 100%);
  --gradient-hero-scrim: linear-gradient(
    105deg,
    rgba(7, 27, 75, 0.94) 0%,
    rgba(7, 27, 75, 0.78) 34%,
    rgba(13, 36, 99, 0.42) 58%,
    rgba(7, 27, 75, 0.18) 78%,
    transparent 92%
  );
  --gradient-hero-bottom: linear-gradient(0deg, rgba(7, 27, 75, 0.88) 0%, transparent 46%);
  --gradient-hero-glow: radial-gradient(ellipse 50% 60% at 72% 42%, rgba(19, 194, 194, 0.16), transparent 70%);

  /* Glass / overlays */
  --glass-rule: rgba(255, 255, 255, 0.16);
  --glass-panel: rgba(7, 27, 75, 0.58);
  --glass-panel-ai: rgba(8, 32, 58, 0.78);
  --glass-metric: rgba(7, 27, 75, 0.45);
  --glass-white-08: rgba(255, 255, 255, 0.08);
  --glass-white-14: rgba(255, 255, 255, 0.14);
  --glass-white-28: rgba(255, 255, 255, 0.28);
  --glass-white-48: rgba(255, 255, 255, 0.48);
  --glass-white-68: rgba(255, 255, 255, 0.68);
  --glass-white-82: rgba(255, 255, 255, 0.82);
  --glass-white-90: rgba(255, 255, 255, 0.9);
  --nav-cta-dark: rgba(15, 23, 42, 0.5);
  --nav-scrolled-bg: rgba(6, 19, 43, 0.88);
  --dialog-backdrop: rgba(7, 27, 75, 0.55);

  --color-cyan-soft: rgba(19, 194, 194, 0.14);
  --color-cyan-mid: rgba(19, 194, 194, 0.4);
  --color-tech-soft: rgba(78, 141, 255, 0.12);
  --color-tech-mid: rgba(78, 141, 255, 0.35);
  --color-ai-soft: rgba(125, 140, 255, 0.14);
  --color-badge-muted: rgba(143, 163, 191, 0.28);
  --color-visual-bg: #0b1a3a;
  --color-cyan-08: rgba(19, 194, 194, 0.08);
  --color-cyan-18: rgba(19, 194, 194, 0.18);
  --color-cyan-35: rgba(19, 194, 194, 0.35);
  --color-cyan-45: rgba(19, 194, 194, 0.45);
  --color-cyan-55: rgba(19, 194, 194, 0.55);
  --color-tech-08: rgba(78, 141, 255, 0.08);
  --color-tech-30: rgba(78, 141, 255, 0.3);
  --color-tech-40: rgba(78, 141, 255, 0.4);
  --color-white-04: rgba(255, 255, 255, 0.04);
  --color-white-10: rgba(255, 255, 255, 0.1);
  --color-white-12: rgba(255, 255, 255, 0.12);
  --color-ink-12: rgba(20, 32, 51, 0.12);
  --color-white-92: rgba(255, 255, 255, 0.92);
  --color-white-96: rgba(255, 255, 255, 0.96);
  --color-white-97: rgba(255, 255, 255, 0.97);
  --shadow-nav: 0 10px 30px rgba(0, 0, 0, 0.18);
  --gradient-badge-ai: linear-gradient(90deg, rgba(19, 194, 194, 0.45), rgba(78, 141, 255, 0.4));
  --gradient-node-ai: linear-gradient(145deg, rgba(19, 194, 194, 0.08), var(--color-white) 55%);
  --gradient-node-goal: linear-gradient(145deg, rgba(78, 141, 255, 0.08), var(--color-white) 55%);
  --gradient-arrow-h: linear-gradient(90deg, var(--color-input), var(--color-cyan));
  --gradient-arrow-v: linear-gradient(180deg, var(--color-input), var(--color-cyan));
  --gradient-change-line: linear-gradient(90deg, var(--color-input), var(--color-cyan) 40%, var(--color-tech) 75%, var(--color-ai));
  --gradient-section-dark: linear-gradient(180deg, var(--color-navy) 0%, var(--color-bg-deep) 100%);
  --gradient-section-base: linear-gradient(180deg, var(--color-bg-alt) 0%, var(--color-bg) 100%);

  /* Layout */
  --gutter: clamp(1.25rem, 4.8vw, 5.5rem);
  --max: 78rem;
  --max-wide: 88rem;
  --space: clamp(4.5rem, 9vw, 8rem);
  --space-sm: clamp(2.5rem, 5vw, 4rem);
  --nav-height: 4.25rem;
  --touch: 44px;

  /* Type */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-display: clamp(1.85rem, 3.2vw, 2.65rem);
  --text-hero: clamp(2rem, 4.5vw, 5rem);
  --text-hero-sm: clamp(1.7rem, 7vw, 2.25rem);

  /* Radius */
  --radius: 1rem;
  --radius-sm: 0.65rem;
  --radius-lg: 1.25rem;
  --radius-pill: 999px;

  /* Motion */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --fast: 180ms;
  --med: 360ms;

  /* Elevation */
  --shadow-soft: 0 12px 34px rgba(20, 32, 51, 0.06);
  --shadow-panel: 0 1rem 2.5rem rgba(0, 0, 0, 0.22);
  --shadow-ai: 0 1.2rem 2.8rem rgba(19, 194, 194, 0.16);
  --shadow-cta: 0 12px 28px rgba(78, 141, 255, 0.22);
  --shadow-dialog: 0 28px 80px rgba(7, 27, 75, 0.28);

  --z-nav: 300;
  --z-modal: 500;
}