/* ============================================
   Iris Schools — style-override.css v5
   参照デザイン完全再現版
   ダークネイビー #2d3748 / 背景 #f7fafc / シャープな角丸
   ============================================ */

/* === 1. CSS変数 完全上書き === */
:root {
  --purple:       #4a5568 !important;
  --purple-dark:  #2d3748 !important;
  --purple-light: #718096 !important;
  --purple-pale:  #edf2f7 !important;
  --purple-bg:    #f7fafc !important;
  --pink:         #c0a478 !important;
  --pink-pale:    #faf3e8 !important;
  --green:        #4a5568 !important;
  --green-dark:   #2d3748 !important;
  --green-pale:   #edf2f7 !important;
  --amber:        #c0a478 !important;
  --amber-pale:   #faf3e8 !important;
  --bg:           #f7fafc !important;
  --bg2:          #edf2f7 !important;
  --white:        #ffffff !important;
  --text:         #1a202c !important;
  --text-sub:     #718096 !important;
  --border:       #e2e8f0 !important;
  --card-shadow:  0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04) !important;
  --radius-lg:    6px !important;
  --radius-md:    4px !important;
  --radius-sm:    3px !important;
}

/* === 2. body背景 === */
body {
  background: #f7fafc !important;
}

/* === 3. ヒーロー — ダークネイビー単色 === */
#hero {
  background: #2d3748 !important;
  background-image: none !important;
}
#hero::before,
#hero::after {
  display: none !important;
}
.hero-badge {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  border-radius: 4px !important;
  color: rgba(255,255,255,0.90) !important;
}
.hero-title span {
  color: #a0aec0 !important;
}
.hero-stat {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 4px !important;
}

/* === 4. ヒーローボタン — 白ベース・シャープ === */
.btn-hero-main {
  background: #ffffff !important;
  color: #2d3748 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  border: none !important;
  transform: none !important;
}
.btn-hero-main:hover {
  background: #edf2f7 !important;
  transform: none !important;
  box-shadow: none !important;
}
.btn-hero-sub {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.30) !important;
  border-radius: 4px !important;
  color: rgba(255,255,255,0.88) !important;
}
.btn-hero-sub:hover {
  background: rgba(255,255,255,0.08) !important;
}

/* === 5. ヘッダー === */
.site-header {
  background: rgba(255,255,255,0.97) !important;
  box-shadow: 0 1px 0 #e2e8f0 !important;
  backdrop-filter: blur(8px) !important;
}
.header-nav a:hover {
  color: #2d3748 !important;
  background: #edf2f7 !important;
}
.header-cta {
  background: #2d3748 !important;
  border-radius: 4px !important;
  border-radius: 999px !important;
}
.header-cta:hover {
  background: #1a202c !important;
}
.logo-icon {
  border-radius: 6px !important;
}

/* === 6. セクションラベル — グレー下線スタイル === */
.section-label {
  background: transparent !important;
  color: #718096 !important;
  border-bottom: 1px solid #cbd5e0 !important;
  border-radius: 0 !important;
  padding: 2px 0 3px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* === 7. セクションタイトル === */
.section-title {
  color: #1a202c !important;
  letter-spacing: -0.02em !important;
}
.section-desc {
  color: #718096 !important;
}

/* === 8. セクション背景 === */
.section-alt,
#features,
#staff,
#faq {
  background: #f7fafc !important;
}
#pricing {
  background: #ffffff !important;
}

/* === 9. サービスカード === */
.service-card {
  background: #ffffff !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
  border-top: 2px solid #e2e8f0 !important;
  transition: none !important;
}
.service-card:hover {
  transform: none !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
}
.service-card.green {
  border-top-color: #a0aec0 !important;
}
.service-card.pink {
  border-top-color: #c0a478 !important;
}
.service-card-icon {
  border-radius: 4px !important;
  background: #edf2f7 !important;
  color: #4a5568 !important;
}
.service-card.green .service-card-icon {
  background: #e2e8f0 !important;
  color: #4a5568 !important;
}
.service-card.pink .service-card-icon {
  background: #faf3e8 !important;
  color: #8a6a38 !important;
}
.service-card h3 {
  color: #1a202c !important;
}
.service-card.green h3 {
  color: #1a202c !important;
}

/* === 10. 統計セクション === */
#stats {
  background: #f7fafc !important;
  background-image: none !important;
  color: #1a202c !important;
}
#stats .section-label {
  color: #718096 !important;
  background: transparent !important;
}
#stats .section-title {
  color: #1a202c !important;
}
#stats .section-desc {
  color: #718096 !important;
}

/* 大きな統計カード（濃色） */
.stats-hero {
  background: #202938 !important;
  background-image: none !important;
  border-radius: 4px !important;
  border: none !important;
}
.stats-hero-num {
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #ffffff !important;
  background-clip: unset !important;
  color: #ffffff !important;
}
.stats-hero-label {
  color: rgba(255,255,255,0.75) !important;
  opacity: 1 !important;
}

/* 小さい統計カード */
.stats-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.stats-card-num {
  background: none !important;
  -webkit-text-fill-color: #1a202c !important;
  color: #1a202c !important;
}
.stats-card-label {
  color: #718096 !important;
  opacity: 1 !important;
}

/* トレンドエリア */
.stats-trend {
  background: #edf2f7 !important;
  background-image: none !important;
  border-radius: 4px !important;
}
.stats-trend h3 {
  color: #1a202c !important;
  opacity: 1 !important;
}
.bar-label {
  color: #4a5568 !important;
  opacity: 1 !important;
}
.bar-track {
  background: #e2e8f0 !important;
}
.bar-fill {
  background: #4a5568 !important;
  background-image: none !important;
}
.bar-fill.accent {
  background: #b89868 !important;
  background-image: none !important;
}

/* === 11. フィーチャーカード === */
.feature-card {
  background: #ffffff !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.feature-card::before {
  background: #2d3748 !important;
  background-image: none !important;
}
.feature-num {
  color: #cbd5e0 !important;
}
.feature-card h3 {
  color: #1a202c !important;
}
.feature-badge {
  background: #edf2f7 !important;
  color: #4a5568 !important;
  border-radius: 3px !important;
}

/* === 12. 料金セクション === */
.pricing-card {
  background: #ffffff !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
  transition: none !important;
}
.pricing-card:hover {
  transform: none !important;
  box-shadow: 0 3px 10px rgba(0,0,0,0.08) !important;
}
.pricing-card.recommended {
  border: 2px solid #4a5568 !important;
}
.pricing-card.recommended::before {
  background: #4a5568 !important;
  color: #ffffff !important;
  border-radius: 0 4px 0 4px !important;
}
.pricing-header {
  background: #edf2f7 !important;
  background-image: none !important;
}
.pricing-badge {
  background: #4a5568 !important;
  border-radius: 3px !important;
}
.pricing-name {
  color: #1a202c !important;
}
.pricing-price {
  color: #1a202c !important;
}
.pricing-per-day {
  background: #f7fafc !important;
}
.pricing-body ul li i {
  color: #718096 !important;
}
.pricing-note strong {
  color: #1a202c !important;
}

/* === 13. スタッフカード === */
.staff-card {
  background: #ffffff !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.staff-card:hover {
  box-shadow: 0 3px 10px rgba(0,0,0,0.08) !important;
}
.staff-avatar {
  background: #edf2f7 !important;
  background-image: none !important;
  border: 2px solid #e2e8f0 !important;
  color: #4a5568 !important;
}
.staff-role {
  color: #4a5568 !important;
  background: #edf2f7 !important;
  border-radius: 3px !important;
}
.staff-name {
  color: #1a202c !important;
}
.staff-tag {
  background: #f7fafc !important;
  color: #4a5568 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 3px !important;
}
.staff-section-label {
  color: #4a5568 !important;
}
.staff-section-label::before {
  background: #cbd5e0 !important;
}
.staff-message-toggle {
  color: #4a5568 !important;
}
.staff-message-quote {
  background: #f7fafc !important;
  border-left: 3px solid #cbd5e0 !important;
}
.staff-message-sign {
  color: #1a202c !important;
}

/* === 14. FAQ === */
#faq {
  background: #f7fafc !important;
}
.faq-item {
  background: #ffffff !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}
.faq-q:hover {
  background: #f7fafc !important;
}
.faq-q-icon {
  background: #4a5568 !important;
  border-radius: 3px !important;
}

/* === 15. CTAセクション === */
#cta {
  background: #2d3748 !important;
  background-image: none !important;
}
.btn-cta-main {
  background: #ffffff !important;
  color: #2d3748 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
.btn-cta-main:hover {
  background: #edf2f7 !important;
  transform: none !important;
  box-shadow: none !important;
}
.btn-cta-sub {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.28) !important;
  border-radius: 4px !important;
  color: rgba(255,255,255,0.88) !important;
}
.btn-cta-sub:hover {
  background: rgba(255,255,255,0.07) !important;
}

/* === 16. フッター === */
footer {
  background: #2c3545 !important;
}
.footer-lower,
footer .footer-bottom,
footer > div:last-child {
  background: #1a202c !important;
}
.footer-link {
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 3px !important;
}

/* === 17. モバイルドロワー === */
.nav-drawer a i {
  color: #4a5568 !important;
}
.nav-drawer a:hover {
  background: #f7fafc !important;
  color: #1a202c !important;
}
.nav-drawer-contact {
  background: #2d3748 !important;
  border-radius: 4px !important;
}
.nav-drawer-contact i {
  color: #ffffff !important;
}

/* === 18. スクロールトップ === */
#scrollTop {
  background: #4a5568 !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.15) !important;
}

/* === 19. アニメーション・トランジション無効化 === */
.fade-up {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
* {
  transition-duration: 0s !important;
}

/* === 20. 角丸を全体的にシャープに（999pxの丸ボタン除く） === */
.logo-icon { border-radius: 6px !important; }
.service-card-icon { border-radius: 4px !important; }

/* === 21. バナー帯（strength-bannerを除外）=== */
.cta-banner {
  background: #faf3e8 !important;
}

/* strength-banner（カウンセリングフロー強みセクション）は濃紺を維持 */
.strength-banner {
  background: #2d3748 !important;
  color: #ffffff !important;
}
.strength-banner-inner {
  background: transparent !important;
}
.strength-headline {
  color: #ffffff !important;
}
.strength-sub {
  color: rgba(255,255,255,0.88) !important;
}
.strength-lead {
  color: rgba(255,255,255,0.7) !important;
}
.strength-chip {
  background: rgba(255,255,255,0.18) !important;
  border-color: rgba(255,255,255,0.65) !important;
  color: #ffffff !important;
}
.strength-chip.highlight {
  background: #c0a478 !important;
  border-color: #c0a478 !important;
  color: #ffffff !important;
}