:root {
  --bg: #f8f4f4;
  --surface: #ffffff;
  --surface-soft: #fbeaea;
  --surface-card: #fbf6f6;
  --text: #17233d;
  --text-muted: #48597a;
  --text-soft: #61708a;
  --primary: #fa7676;
  --primary-soft: #f0d5d4;
  --tag-muted: #edf0f4;
  --border-soft: #f0e3e3;
  --shadow-soft: 0 20px 40px rgba(44, 34, 34, 0.08);
  --shadow-card: 0 14px 24px rgba(55, 45, 45, 0.12);
  --container: 1280px;
  --header-height: 84px;
  --radius-pill: 999px;
  --footer-bg: #130405;

  /* Typography system based on project-detail page */
  --fs-display: clamp(44px, 5.1vw, 96px);
  --fs-page-title: clamp(36px, 5vw, 64px);
  --fs-section-title: clamp(34px, 2.8vw, 54px);
  --fs-card-title: clamp(26px, 1.9vw, 34px);
  --fs-body-lg: clamp(19px, 1.36vw, 29px);
  --fs-body: clamp(16px, 1.05vw, 21px);
  --fs-label: 15px;
  --fs-caption: 14px;

  --fw-display: 500;
  --fw-title: 500;
  --fw-strong: 500;
  --fw-label: 600;
  --fw-body: 400;

  --lh-tight: 1.04;
  --lh-body: 1.55;
  --ls-title: -0.02em;
  --ls-label: 0.14em;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}