/* ============================================
   NEXR ARTS — Design Tokens（nexr-arts テーマと共通）
   ============================================ */

:root {

  /* 色 */
  --color-bg:           #FAFAF8;
  --color-white:        #FFFFFF;
  --color-text:         #1A1A1A;
  --color-text-mid:     #444444;
  --color-text-light:   #888888;
  --color-accent:       #4a7c8f;
  --color-accent-dark:  #3a6070;
  --color-accent-light: #d0e4eb;
  --color-border:       #E4E4E0;
  --color-border-dark:  #C8C8C2;

  --color-bg-primary:     #FAFAF8;
  --color-bg-secondary:   #F0F0EC;
  --color-bg-surface:     #E8E8E4;
  --color-bg-elevated:    #E0E0DC;
  --color-text-primary:   #1A1A1A;
  --color-text-secondary: #444444;
  --color-text-muted:     #888888;
  --color-text-accent:    #4a7c8f;
  --color-border-light:   #C8C8C2;
  --color-overlay:        rgba(0, 0, 0, 0.4);

  /* フォント */
  --font-serif: 'Noto Serif JP', 'Yu Mincho', '游明朝', 'Hiragino Mincho ProN', serif;
  --font-sans:  'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;

  --fw-light:    300;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --fs-h1:    clamp(1.75rem, 4vw, 2.25rem);
  --fs-h2:    clamp(1.25rem, 2.5vw, 1.5rem);
  --fs-body:  1rem;
  --fs-small: 0.875rem;
  --fs-xs:    0.75rem;

  --lh-heading: 1.5;
  --lh-body:    1.8;
  --ls-wide:    0.12em;

  /* スペーシング */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;

  /* レイアウト */
  --container-max:     960px;
  --container-narrow:  600px;
  --container-padding: clamp(1.25rem, 4vw, 2.5rem);
  --nav-height:        64px;

  /* トランジション */
  --transition-fast: 0.2s ease;
  --transition-base: 0.35s ease;

  /* ボーダー */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;

  /* Z-index */
  --z-header: 1000;
}

@media (max-width: 768px) {
  :root {
    --nav-height: 56px;
  }
}