/* 设计 Token —— 现代国际滨水调性（精修版）
   目标：premium 旅行杂志式国际滨水感，规避政务土味 / AI 通用感
   约束：系统字体栈（弱网友好，无外网字体依赖）、无障碍基线、流体排版 */
:root {
  /* ---------- 品牌色：maritime teal · night navy · sunset gold · coral ---------- */
  --c-primary: #0b4f6c;        /* 海港主蓝绿 */
  --c-primary-600: #0c5a7b;
  --c-primary-700: #083d54;
  --c-ink: #06222f;            /* 深夜港蓝（Hero/Footer 戏剧深底） */
  --c-ink-800: #0a3245;
  --c-secondary: #145c7e;
  --c-accent: #f2a541;         /* 落日金 */
  --c-accent-600: #e08e1c;
  --c-accent-300: #ffcf8a;     /* 浅金（暗底文字/描边） */
  --c-coral: #e76f51;          /* 活动高亮珊瑚 */
  --c-coral-600: #d85c3e;
  --c-teal-mist: #7fd1c4;      /* 海雾青（点缀） */

  /* ---------- 中性 ---------- */
  --c-bg: #ffffff;
  --c-surface: #f2f7f9;
  --c-surface-2: #e6eef2;
  --c-surface-3: #d7e3e9;
  --c-text: #14212c;
  --c-text-muted: #566470;
  --c-text-soft: #7a8791;
  --c-border: #dce5eb;
  --c-border-strong: #c3d1da;
  --c-on-primary: #ffffff;

  /* ---------- 渐变与氛围 ---------- */
  --grad-hero: linear-gradient(180deg, rgba(6,34,47,.10) 0%, rgba(6,34,47,.45) 45%, rgba(6,34,47,.88) 100%);
  --grad-gold: linear-gradient(100deg, #f2a541 0%, #ffcf8a 100%);
  --grad-teal: linear-gradient(135deg, #0b4f6c 0%, #145c7e 60%, #1c7a92 100%);
  --grad-ink: linear-gradient(160deg, #0a3245 0%, #06222f 100%);
  --grad-surface: linear-gradient(180deg, #ffffff 0%, #f2f7f9 100%);
  /* 细噪点纹理（内联 SVG，零请求，营造质感规避扁平 AI 感） */
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");

  /* ---------- 排版（系统栈 + 流体字号 clamp） ---------- */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", sans-serif;
  /* 展示字：偏几何/克制，用系统字重与字距拉出编辑感 */
  --font-display: var(--font-sans);

  --fs-xs: 13px;
  --fs-sm: 14px;
  --fs-base: clamp(16px, 1vw + 14px, 17px);   /* 正文 ≥16px 户外可读 */
  --fs-lg: clamp(18px, 1.2vw + 15px, 21px);
  --fs-xl: clamp(22px, 2vw + 14px, 28px);
  --fs-2xl: clamp(28px, 3.2vw + 12px, 40px);
  --fs-3xl: clamp(38px, 6vw + 8px, 76px);      /* Hero 大标题 */
  --lh-tight: 1.08;
  --lh-snug: 1.28;
  --lh-base: 1.62;
  --tracking-kicker: .16em;
  --tracking-tight: -.02em;

  /* ---------- 间距（8pt 体系 + 更大留白档） ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 88px;
  --sp-10: 120px;

  /* ---------- 圆角 / 阴影（更细腻分层） ---------- */
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --shadow-sm: 0 1px 2px rgba(6,34,47,.06), 0 2px 6px rgba(6,34,47,.06);
  --shadow: 0 8px 24px rgba(6,34,47,.10), 0 2px 8px rgba(6,34,47,.06);
  --shadow-lg: 0 18px 50px rgba(6,34,47,.18), 0 6px 16px rgba(6,34,47,.10);
  --shadow-gold: 0 8px 24px rgba(224,142,28,.35);

  /* ---------- 无障碍触觉基线 ---------- */
  --tap-min: 44px;
  --focus-ring: 0 0 0 3px rgba(242,165,65,.65);

  /* ---------- 容器 / 布局 ---------- */
  --container: 1240px;
  --container-wide: 1440px;
  --nav-h: 68px;
  --ease-out: cubic-bezier(.16,.84,.44,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
}
