/*
 * brand-tokens.css — towanone ブランドデザイントークン
 * 全プロダクト共通。各プロダクトはこのファイルを取り込んで使用する。
 *
 * 管理: towanone
 * 追従確認: nexo（統合台帳）
 * Version: 1.0.0
 */

:root {
  /* =============================================
     1. カラー
     ============================================= */

  /* ベースカラー（和紙調ウォーム） */
  --brand-bg:          #f6f4ee;
  --brand-bg-alt:      #eeebe3;
  --brand-bg-subtle:   #e6e2d8;
  --brand-text:        #2a2a30;
  --brand-text-light:  #5a5a64;
  --brand-heading:     #141418;

  /* ダークセクション（舞台裏・テクノロジー感） */
  --brand-dark:        #0f1419;
  --brand-dark-alt:    #151c21;
  --brand-dark-text:   #f0efe8;
  --brand-dark-muted:  rgba(240, 239, 232, 0.6);

  /* アクセント — 緑青（テクノロジー×伝統） */
  --brand-primary:       #2A7B7B;
  --brand-primary-light: #5bb8b8;
  --brand-primary-dark:  #1F5F5F;

  /* アクセント — 金（格調・控えめな輝き） */
  --brand-gold:      #c4a45a;
  --brand-gold-soft:  #d9c48e;
  --brand-gold-glow:  rgba(196, 164, 90, 0.25);

  /* セカンダリ（土・木の温かみ） */
  --brand-secondary:       #7A6B4E;
  --brand-secondary-light: #9A8B6E;

  /* 機能カラー */
  --brand-border:       #d8d4ca;
  --brand-border-dark:  rgba(255, 255, 255, 0.08);
  --brand-success:      #2F855A;
  --brand-warning:      #B7791F;

  /* =============================================
     2. タイポグラフィ
     ============================================= */

  /* フォントファミリー */
  --brand-font-body:    "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
  --brand-font-heading: "Noto Serif JP", "Noto Sans JP", "Hiragino Sans", "メイリオ", sans-serif;
  --brand-font-code:    "Source Code Pro", "Menlo", "Consolas", monospace;

  /* 行間 */
  --brand-line-height:         1.9;
  --brand-line-height-heading: 1.4;

  /* =============================================
     3. 余白・角丸・シャドウ
     ============================================= */

  /* セクション間余白 */
  --brand-space-section: 5rem;      /* デスクトップ */
  --brand-space-block:   2.5rem;    /* ブロック間 */
  --brand-space-element: 1rem;      /* 要素間 */

  /* 角丸 */
  --brand-radius-sm: 6px;
  --brand-radius-md: 10px;
  --brand-radius-lg: 16px;

  /* シャドウ */
  --brand-shadow-sm: 0 1px 3px rgba(75, 62, 58, 0.06);
  --brand-shadow-md: 0 4px 12px rgba(75, 62, 58, 0.08);
  --brand-shadow-lg: 0 8px 24px rgba(75, 62, 58, 0.10);

  /* =============================================
     4. トランジション
     ============================================= */
  --brand-transition:      0.25s ease;
  --brand-transition-slow: 0.4s ease;
}

/* モバイル余白調整 */
@media (max-width: 767px) {
  :root {
    --brand-space-section: 3rem;
    --brand-space-block:   1.5rem;
  }
}
