:root {
  --solution-color-primary: #4088ff;
  --solution-color-primary-50: #eff4fd;
  --solution-color-primary-100: #e7effe;
  --solution-color-primary-150: #d8e7ff;
  --solution-color-primary-200: #c5dbff;
  --solution-color-primary-300: #8cb7ff;

  --solution-color-pink-50: #fef2f4;
  --solution-color-pink-250: #f79cb2;
  --solution-color-pink-300: #f485a0;
  --solution-color-pink-400: #ea5178;

  --solution-color-navy-50: #f1f3f7;
  --solution-color-navy-150: #dae0ea;
  --solution-color-navy-300: #9eabc2;
  --solution-color-navy-800: #213861;
  --solution-color-navy-950: #0d1c3d;

  --solution-color-text: #252b31;
  --solution-color-text-subtle: #5f6670;
  --solution-color-text-muted: #767e88;
  --solution-color-border: #d1d4d9;
  --solution-color-border-light: #ebedef;
  --solution-color-surface: #ffffff;
  --solution-color-surface-subtle: #f5f6f7;
  --solution-color-surface-muted: #fbfbfc;

  --solution-radius-xs: 4px;
  --solution-radius-sm: 6px;
  --solution-radius-md: 8px;
  --solution-radius-lg: 16px;
  --solution-radius-xl: 32px;
  --solution-radius-full: 1000px;

  --solution-content-width: 1120px;
  --solution-wide-width: 1200px;
  --solution-page-padding: 60px;
  --solution-section-space: 80px;

  /* Typography primitives — Figma typo/font and font-size collections */
  --solution-font-family: "Pretendard Variable", Pretendard, -apple-system,
    BlinkMacSystemFont, system-ui, "Apple SD Gothic Neo", "Noto Sans KR",
    sans-serif;
  --solution-font: var(--solution-font-family);

  --solution-font-weight-regular: 400;
  --solution-font-weight-medium: 500;
  --solution-font-weight-semibold: 600;
  --solution-font-weight-bold: 700;
  --solution-font-weight-extrabold: 800;

  --solution-font-size-caption-small: 11px;
  --solution-font-size-caption-large: 12px;
  --solution-font-size-label-small: 13px;
  --solution-font-size-label-large: 14px;
  --solution-font-size-body-xsmall: 13px;
  --solution-font-size-body-small: 14px;
  --solution-font-size-body-medium: 15px;
  --solution-font-size-body-large: 16px;
  --solution-font-size-subtitle-small: 17px;
  --solution-font-size-subtitle-large: 18px;
  --solution-font-size-heading-small: 20px;
  --solution-font-size-heading-medium: 22px;
  --solution-font-size-heading-large: 24px;
  --solution-font-size-title-small: 28px;
  --solution-font-size-title-medium: 32px;
  --solution-font-size-title-large: 36px;
  --solution-font-size-display-large: 60px;

  --solution-font-line-height-normal: 1.4;
  --solution-font-line-height-reading: 1.6;

  /* Typography aliases — Figma text-style names */
  --solution-typography-caption-small-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-caption-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-caption-small-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-caption-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-caption-large-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-caption-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-caption-large-medium: var(--solution-font-weight-medium)
    var(--solution-font-size-caption-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-caption-large-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-caption-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-label-small-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-label-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-label-small-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-label-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-label-large-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-label-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-xsmall-normal-medium: var(--solution-font-weight-medium)
    var(--solution-font-size-body-xsmall) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-xsmall-normal-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-body-xsmall) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-xsmall-normal-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-body-xsmall) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-xsmall-reading-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-body-xsmall) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-body-xsmall-reading-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-body-xsmall) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-body-small-normal-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-body-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-small-normal-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-body-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-small-normal-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-body-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-small-reading-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-body-small) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-body-small-reading-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-body-small) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-body-medium-normal-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-body-medium) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-medium-normal-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-body-medium) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-medium-normal-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-body-medium) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-body-medium-reading-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-body-medium) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-body-large-reading-medium: var(--solution-font-weight-medium)
    var(--solution-font-size-body-large) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-body-large-reading-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-body-large) / var(--solution-font-line-height-reading)
    var(--solution-font-family);
  --solution-typography-subtitle-small-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-subtitle-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-subtitle-small-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-subtitle-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-subtitle-large-regular: var(--solution-font-weight-regular)
    var(--solution-font-size-subtitle-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-subtitle-large-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-subtitle-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-heading-small-semibold: var(--solution-font-weight-semibold)
    var(--solution-font-size-heading-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-heading-small-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-heading-small) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-heading-medium-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-heading-medium) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-heading-large-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-heading-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
  --solution-typography-title-large-bold: var(--solution-font-weight-bold)
    var(--solution-font-size-title-large) / var(--solution-font-line-height-normal)
    var(--solution-font-family);
}

@media (max-width: 1023px) {
  :root {
    --solution-page-padding: 60px;
  }
}

@media (max-width: 767px) {
  :root {
    --solution-page-padding: 20px;
    --solution-section-space: 64px;
  }
}