@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,600&family=Shippori+Mincho:wght@500;700&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  /* ブランドカラー */
  --color-primary:   #16202E;
  --color-secondary: #2C3D54;
  --color-accent:    #9E7D45;
  --color-accent-lt: #B8965A;
  --color-slate:     #6B8CA0;
  --color-linen:     #E8DFD0;
  --color-linen-lt:  #F4F0EA;
  --color-base:      #FAFAF8;
  --color-sub:       #4A4640;

  /* 既存CSSとの互換エイリアス */
  --color-white:     #ffffff;
  --color-bg:        var(--color-base);
  --color-surface:   var(--color-linen-lt);
  --color-border:    var(--color-linen);
  --color-text:      var(--color-sub);
  --color-text-sub:  #6B7280;

  /* フォント */
  --font-serif:   'Shippori Mincho', serif;
  --font-sans:    'DM Sans', sans-serif;
  --font-display: 'Cormorant Garamond', serif;

  /* スペーシング */
  --sp-4:  16px; --sp-6:  24px; --sp-8:  32px;
  --sp-12: 48px; --sp-16: 64px; --sp-20: 80px;

  /* レイアウト */
  --container: 1200px;
  --btn-height: 48px;
  --radius: 4px;
}