/* ============================================
   common.css - 全ページ共通カスタムスタイル
   ============================================ */

/* なぎの木ブランドカラー CSS変数（Tailwind config と同期） */
:root {
  --nagi-50: #FAFCF8;
  --nagi-100: #F0F5EC;
  --nagi-200: #E0ECDA;
  --nagi-300: #C5D9BC;
  --nagi-400: #A7C49C;
  --nagi-500: #8BB47E;
  --nagi-600: #7DA672;
  --nagi-700: #5C8055;
  --nagi-800: #4A6845;
  --nagi-900: #3A5438;
}

html { scroll-behavior: smooth; }
body { font-family: 'Noto Sans JP', sans-serif; }

/* ヒーロー＋理念 統合セクション (index.html) */
.hero-wrapper {
  position: relative;
  height: 200vh;
}
.hero-photo {
  position: absolute;
  inset: 0;
  background: url('/images/hero.jpeg') center center / cover no-repeat;
  background-attachment: fixed;
}
.hero-photo::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.45);
}
.hero-content {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}
.hero-white-overlay {
  position: absolute;
  inset: 0;
  background: white;
  opacity: 0;
  pointer-events: none;
  z-index: 3;
}

/* 後続セクションが写真の上に来るように */
.content-section {
  position: relative;
  z-index: 20;
  background: white;
}

/* 理念テキスト フェードイン */
.philosophy-text {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.philosophy-text.visible {
  opacity: 1;
  transform: translateY(0);
}

/* タイムライン (index.html 沿革) */
.timeline-line {
  position: relative;
}
.timeline-line::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #E0ECDA;
  transform: translateX(-50%);
}
@media (max-width: 768px) {
  .timeline-line::before {
    left: 24px;
  }
}

/* サービスカード ホバーエフェクト */
.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(107, 143, 94, 0.15);
}

/* ナビゲーション スクロール時 */
.nav-scrolled {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.08);
}

/* 管理画面 トグルスイッチ (admin.html) */
.toggle-checkbox:checked { right: 0; border-color: #7DA672; }
.toggle-checkbox:checked + .toggle-label { background-color: #8BB47E; }
.toggle-checkbox { transition: all 0.3s ease; }