@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@700;800;900&family=Noto+Sans+JP:wght@400;500;700;900&display=swap');

:root {
  /* ベースカラー（SVG公式の背景色 #2C292A に完全統一） */
  --color-white:      #FFFFFF;
  --color-white-soft: #F9FAFB;
  --color-black:      #2C292A;
  --color-dark:       #2C292A;
  --color-gray:       #4B5563;
  --color-gray-light: #E5E7EB;
  --color-gray-mid:   #F3F4F6;

  /* アクセントカラー（鮮やかなレッド） */
  --color-accent:     #E63946;
  --color-accent-dark:#C1121F;
  --color-accent-glow:rgba(230, 57, 70, 0.35);

  /* 本物の7色レインボーグラデーション */
  --gradient-rainbow: linear-gradient(135deg,
    #FF2D55 0%,
    #FF9500 16%,
    #FFCC00 33%,
    #34C759 50%,
    #00C7BE 66%,
    #007AFF 83%,
    #AF52DE 100%
  );

  /* 横方向レインボー */
  --gradient-rainbow-h: linear-gradient(90deg,
    #FF2D55 0%,
    #FF9500 16%,
    #FFCC00 33%,
    #34C759 50%,
    #00C7BE 66%,
    #007AFF 83%,
    #AF52DE 100%
  );

  /* 【高級塗料・クリアコート質感シャドウ】 */
  /* 塗りたてクリア塗装のツヤ感（外側の柔らかい影 ＋ 内側の鋭い光沢ハイライト） */
  --paint-gloss: 0 4px 20px rgba(0, 0, 0, 0.08), inset 0 1px 1px rgba(255, 255, 255, 0.85);
  --paint-deep-gloss: 0 12px 36px rgba(0, 0, 0, 0.12), inset 0 1.5px 2px rgba(255, 255, 255, 0.95);
  --paint-card-shadow: 0 8px 30px rgba(15, 17, 21, 0.06), 0 1px 3px rgba(15, 17, 21, 0.04);
  --paint-card-hover: 0 16px 40px rgba(15, 17, 21, 0.12), 0 2px 6px rgba(15, 17, 21, 0.06);

  /* フォント */
  --font-heading: 'Outfit', sans-serif;
  --font-body:    'Noto Sans JP', sans-serif;

  /* スペーシング */
  --section-padding: clamp(60px, 8vw, 110px) clamp(16px, 4vw, 32px);
  --section-padding-sm: clamp(40px, 6vw, 70px) clamp(16px, 4vw, 24px);
  --max-width: 1180px;

  /* トランジション */
  --transition: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 0.2s ease;
}