:root {
  --font-sans: "Noto Sans SC", "Helvetica Neue", Arial, "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-display: "Noto Sans SC", "PingFang SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;
  --font-num: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;

  --ui-label-size: 11px;
  --ui-meta-size: 13px;
  --ui-body-size: 15px;
  --ui-body-large-size: 17px;
  --fs-display: clamp(30px, 3.6vw, 52px);
  --fs-heading: clamp(20px, 2.2vw, 30px);
  --ui-label-line: 1.3;
  --ui-meta-line: 1.4;
  --ui-body-line: 1.7;
  --ui-heading-line: 1.04;
  --ui-label-track: .12em;

  --w-regular: 400;
  --w-medium: 500;
  --w-bold: 700;
  --w-black: 900;

  --ui-ink: #171817;
  --ui-muted: #6f706c;
  --ui-faint: #9a968a;
  --ui-neutral-muted: var(--ui-muted);
}

#portfolio-short-video .eyebrow,
#portfolio-short-video .ops-metric-label,
#portfolio-short-video .ops-footer,
#portfolio-feed-ad .section-index,
#portfolio-feed-ad .project-number,
#portfolio-feed-ad .project-code,
#portfolio-feed-ad .evidence-label,
#portfolio-ppt .project-title .number,
#portfolio-ppt .project-meta,
#portfolio-ai-video .ai-section-label {
  font-family: var(--font-num);
  font-size: var(--ui-label-size);
  font-weight: var(--w-bold);
  letter-spacing: var(--ui-label-track);
  line-height: var(--ui-label-line);
}

#portfolio-short-video .ops-metric-value,
#portfolio-feed-ad .result strong,
#portfolio-feed-ad .metric strong,
#portfolio-video-cases .vc-count {
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
}

#portfolio-short-video .ops-summary,
#portfolio-short-video .snapshot-heading p:last-child,
#portfolio-feed-ad .hero-lede,
#portfolio-feed-ad .method-item p,
#portfolio-feed-ad .project-summary span,
#portfolio-feed-ad .project-copy > p,
#portfolio-feed-ad .decision-box p,
#portfolio-feed-ad .evidence-head p,
#portfolio-feed-ad .evidence-note,
#portfolio-video-cases .vc-description {
  font-family: var(--font-sans);
  font-size: var(--ui-body-size);
  font-weight: var(--w-medium);
  line-height: var(--ui-body-line);
}

#portfolio-short-video .ops-summary,
#portfolio-short-video .snapshot-heading p:last-child {
  color: var(--ui-muted);
}

#portfolio-feed-ad .method-item p,
#portfolio-feed-ad .project-summary span,
#portfolio-feed-ad .project-copy > p,
#portfolio-feed-ad .decision-box p,
#portfolio-feed-ad .evidence-head p,
#portfolio-feed-ad .evidence-note {
  color: var(--ui-muted);
}

#portfolio-ppt .project-meta,
#portfolio-ppt .footer {
  color: var(--ui-muted);
}

#portfolio-feed-ad .hero-lede {
  font-size: var(--ui-body-large-size);
}

#portfolio-short-video .ops-story h3,
#portfolio-short-video .intro h1,
#portfolio-short-video .snapshot-heading h2,
#portfolio-feed-ad .hero h1,
#portfolio-feed-ad .method-heading h2,
#portfolio-feed-ad .project-title h2,
#portfolio-feed-ad .project-copy h3,
#portfolio-design .works-title,
#portfolio-design .album-title,
#portfolio-design .photography-title,
#portfolio-design .gzh-title,
#portfolio-design .seo-title,
#portfolio-ppt .project-title,
#portfolio-video-cases .vc-title {
  font-weight: var(--w-black);
  letter-spacing: 0;
  line-height: var(--ui-heading-line);
}

#portfolio-feed-ad .project-summary strong,
#portfolio-feed-ad .decision-box strong,
#portfolio-feed-ad .evidence-head h3,
#portfolio-feed-ad .method-item h3,
#portfolio-video-cases .vc-open-label {
  font-weight: var(--w-black);
}

#portfolio-short-video .ops-story h3,
#portfolio-short-video .snapshot-heading h2,
#portfolio-feed-ad .hero h1,
#portfolio-feed-ad .project-copy h3 {
  font-size: var(--fs-display);
  line-height: 1.08;
}

#portfolio-short-video .detail-title,
#portfolio-feed-ad .method-heading h2,
#portfolio-feed-ad .project-title h2,
#portfolio-video-cases .vc-title,
#portfolio-ppt .project-title,
#portfolio-ai-video .ai-direction-head h2,
#portfolio-ai-video .ai-index-head h2 {
  font-size: var(--fs-heading);
  line-height: 1.18;
}

#portfolio-feed-ad .method-item h3,
#portfolio-feed-ad .evidence-head h3,
#portfolio-ppt .modal-caption strong {
  font-size: var(--ui-body-size);
}

@media (max-width: 760px) {
  #portfolio-short-video .ops-summary,
  #portfolio-short-video .snapshot-heading p:last-child,
  #portfolio-feed-ad .method-item p,
  #portfolio-feed-ad .project-summary span,
  #portfolio-feed-ad .project-copy > p,
  #portfolio-feed-ad .decision-box p,
  #portfolio-feed-ad .evidence-head p,
  #portfolio-feed-ad .evidence-note,
  #portfolio-video-cases .vc-description {
    font-size: var(--ui-meta-size);
    line-height: 1.65;
  }

  #portfolio-feed-ad .hero-lede {
    font-size: var(--ui-body-size);
  }

  #portfolio-short-video .ops-story h3,
  #portfolio-short-video .snapshot-heading h2,
  #portfolio-feed-ad .hero h1,
  #portfolio-feed-ad .project-copy h3 {
    font-size: clamp(26px, 7.5vw, 36px);
  }

  #portfolio-short-video .detail-title,
  #portfolio-feed-ad .method-heading h2,
  #portfolio-feed-ad .project-title h2,
  #portfolio-video-cases .vc-title,
  #portfolio-ppt .project-title,
  #portfolio-ai-video .ai-direction-head h2,
  #portfolio-ai-video .ai-index-head h2 {
    font-size: 22px;
  }
}
