/* ============================================================
   ColorPark 设计令牌 (Design Tokens)
   ------------------------------------------------------------
   取样自现有 Logo 的皇家蓝、珊瑚红、金黄、橙、薄荷绿和青蓝。
   深蓝用于结构与信息，珊瑚红用于主要行动；其余色彩用于场景区分与趣味点缀。
   ============================================================ */

:root {
  /* ---------- 品牌色 ---------- */
  /* Logo 原色 + 满足文字对比度的深色阶。 */
  --brand-blue-logo: #4050A0;
  --brand-coral-logo: #E85A5D;
  --brand-red-logo: #DF2432;
  --brand-gold-logo: #E8BF18;
  --brand-orange-logo: #F09A35;
  --brand-mint-logo: #70C0A0;
  --brand-cyan-logo: #48B8D8;
  --brand-500: #4050A0;
  --brand-600: #304389;
  --brand-700: #223574;
  --brand-coral: #C9454B;
  --brand-coral-deep: #AD3038;
  --brand-teal: #247D69;
  --brand-gold: #E8BF18;
  --brand-orange: #D97922;
  --brand-cyan: #247FA3;
  --brand-blue-soft: #F0F2FB;
  --brand-coral-soft: #FFF0F0;
  --brand-mint-soft: #EDF8F4;
  --brand-gold-soft: #FFF9DF;

  /* ---------- 中性色阶 ---------- */
  --ink-900: #17284A;
  /* 从 Logo 蓝色下沉的深色区块底 */
  --ink-700: #243552;
  /* 正文主文字 */
  --ink-500: #596779;
  /* 次级文字 */
  --ink-400: #6B7280;
  /* 辅助说明、表头 */
  --ink-300: #9CA3AF;
  /* 占位符、禁用态 */
  --line: #E3E6EA;
  /* 分割线、卡片描边 */
  --surface-1: #F7F9FC;
  /* 浅灰区块 */
  --surface-0: #FFFFFF;
  /* 页面底色 */

  /* ---------- 功能色 ---------- */
  --tech-500: var(--brand-600);
  /* 技术语境：API 链接、代码标识符 */
  --success: #12A150;
  /* 调通状态、设备在线 */
  --warning: #B8730A;
  /* 弃用提示、限流提醒 */
  --danger: #D1332E;
  /* 错误码、破坏性操作 */

  /* ---------- 字体 ---------- */
  --font-sans: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei",
    -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;

  /* ---------- 字号阶梯（桌面） ---------- */
  --fs-display: 56px;
  --fs-h1: 40px;
  --fs-h2: 32px;
  --fs-h3: 22px;
  --fs-body-l: 18px;
  --fs-body: 16px;
  --fs-caption: 14px;
  --fs-code: 14px;

  /* ---------- 行高 ---------- */
  --lh-display: 1.15;
  --lh-h: 1.3;
  --lh-body: 1.75;
  --lh-code: 1.6;

  /* ---------- 间距（4px 基准） ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-24: 96px;

  /* ---------- 圆角 ---------- */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* ---------- 布局 ---------- */
  --container: 1200px;
  --container-doc: 1440px;
}

/* ============================================================
   通用组件（跨页面复用，原为模板内联 style="..."）
   ============================================================ */

/* 区块小标题（产品页 / 案例页共用）
   原内联值：font-size:20px; font-weight:600; margin:28px 0 12px; color:#1f2328 */
.section-heading {
  font-size: 20px;
  font-weight: 600;
  margin: 28px 0 12px;
  color: var(--ink-700);
}

@media screen and (max-width: 767px) {
  .section-heading {
    font-size: 18px;
    margin: 20px 0 10px;
  }
}

/* 移动端字号下调 */
@media screen and (max-width: 767px) {
  :root {
    --fs-display: 32px;
    --fs-h1: 28px;
    --fs-h2: 24px;
    --fs-h3: 18px;
    --fs-body-l: 17px;
    --fs-code: 13px;
  }
}

/* Shared spacing for legacy Layui page containers. */
.layui-container.product-page,
.layui-container.case-page,
.layui-container.cloud-page,
.layui-container.about-page,
.layui-container.api-page,
.layui-container.house-detail {
  box-sizing: border-box;
  padding-left: 24px;
  padding-right: 24px;
}

@media (max-width: 767px) {

  .layui-container.product-page,
  .layui-container.case-page,
  .layui-container.cloud-page,
  .layui-container.about-page,
  .layui-container.api-page,
  .layui-container.house-detail {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }
}