/*
 * AIラジオ・資格検定合格『耳トレ』シリーズ
 * 共通スタイル（9資格すべてが読み込む）
 * mimitore.online 2026-05-23
 */

:root {
  --navy: #1E3A5F;
  --navy-dark: #14253E;
  --navy-mid: #2A5489;
  --orange: #FF6B35;
  --bg: #FAFAFA;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Noto Sans JP', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--bg);
  color: #1a1a1a;
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

/* フォントクラス */
.font-en { font-family: 'Inter', sans-serif; }

/* ブランドカラー（Tailwindユーティリティ拡張） */
.bg-navy   { background-color: var(--navy); }
.bg-orange { background-color: var(--orange); }
.text-navy   { color: var(--navy); }
.text-orange { color: var(--orange); }
.border-orange { border-color: var(--orange); }

/* 共通グラデーション */
.hero-bg {
  background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 55%, var(--navy-mid) 100%);
}

/* CTAボタン共通 */
.cta-button {
  background: var(--orange);
  color: white;
  font-weight: 700;
  transition: all 0.2s ease;
  box-shadow: 0 6px 16px rgba(255, 107, 53, 0.35);
}
.cta-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(255, 107, 53, 0.45);
}

/* オーディオプレイヤー軽量化 */
audio {
  width: 100%;
  max-width: 480px;
}

/* スマホ最適化補正 */
@media (max-width: 640px) {
  h1 { letter-spacing: -0.02em; }
}