/* ==========================================================================
   VYRON theme-a.css — 黒×オレンジ（採用テーマ）
   支給ロゴ（白×オレンジ）に合わせた黒ベース配色
   トーン調整はこの変数を変更するだけでサイト全体に反映される
   ========================================================================== */

:root {
  /* ベースカラー */
  --color-bg: #0b0b0d;
  --color-bg-alt: #101013;
  --color-surface: #16161a;
  --color-border: rgba(255, 255, 255, 0.09);

  /* テキスト */
  --color-heading: #f7f7f5;
  --color-text: #c9c9ce;
  --color-text-muted: #94949c;

  /* アクセント（ロゴのオレンジ） */
  --color-accent: #f9930f;
  --color-accent-2: #ff7a2f;
  --gradient-accent: linear-gradient(120deg, #ffa426, #f9700f);

  /* ボタン */
  --color-btn-text: #150c02;
  --color-btn-outline: rgba(255, 255, 255, 0.28);
  --shadow-btn: 0 8px 28px rgba(249, 147, 15, 0.32);

  /* カード */
  --shadow-card: 0 16px 40px rgba(0, 0, 0, 0.55);
  --color-icon-bg: rgba(249, 147, 15, 0.12);

  /* ヘッダー / ドロワー */
  --color-header-bg: rgba(11, 11, 13, 0.85);
  --color-drawer-bg: #0b0b0d;

  /* ヒーロー */
  --hero-bg: linear-gradient(160deg, #0b0b0d 0%, #16100b 55%, #0b0b0d 100%);
  --hero-deco:
    radial-gradient(ellipse 640px 420px at 82% 18%, rgba(249, 147, 15, 0.14), transparent 70%),
    radial-gradient(ellipse 560px 400px at 12% 88%, rgba(255, 122, 47, 0.1), transparent 70%);
  --hero-grid:
    linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
  --color-hero-brand: rgba(255, 255, 255, 0.045);
  --color-eyebrow-border: rgba(249, 147, 15, 0.4);
  --color-eyebrow-bg: rgba(249, 147, 15, 0.08);

  /* お問い合わせ */
  --contact-bg: linear-gradient(160deg, #16100b 0%, #1c130c 100%);
}