:root {
  --brand-font-sans: "Inter", "Noto Sans JP", sans-serif;

  --brand-color-bg: #ffffff;
  --brand-color-bg-soft: #f5f5f2;
  --brand-color-surface: #fbfbf8;
  --brand-color-surface-soft: #f4f1ea;
  --brand-color-surface-strong: #111111;
  --brand-color-text: #111111;
  --brand-color-text-soft: rgba(17, 17, 17, 0.7);
  --brand-color-text-muted: rgba(17, 17, 17, 0.66);
  --brand-color-text-faint: rgba(17, 17, 17, 0.5);
  --brand-color-text-inverse: rgba(255, 255, 255, 0.84);
  --brand-color-line: rgba(17, 17, 17, 0.08);
  --brand-color-line-strong: rgba(17, 17, 17, 0.14);
  --brand-color-accent: #c51f1a;
  --brand-color-white: #ffffff;
  --brand-color-black: #0b0b0b;

  --brand-container: 1180px;
  --brand-header-height: 84px;

  --brand-radius-lg: 28px;
  --brand-radius-md: 20px;
  --brand-radius-sm: 14px;

  --brand-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.15);
  --brand-shadow-md: 0 18px 48px rgba(0, 0, 0, 0.08);
  --brand-shadow-sm: 0 12px 30px rgba(0, 0, 0, 0.05);

  --brand-eyebrow-size: 11px;
  --brand-eyebrow-weight: 700;
  --brand-eyebrow-spacing: 0.22em;

  --brand-h1-size: clamp(46px, 8vw, 104px);
  --brand-h1-line: 0.9;
  --brand-h1-weight: 900;

  --brand-h2-size: clamp(34px, 4.5vw, 68px);
  --brand-h2-line: 0.98;
  --brand-h2-weight: 800;

  --brand-body-size: 16px;
  --brand-body-line: 1.7;
}
