/* --- AERO-NEXUS Design System (Mediterranean / European Modern) --- */
:root {
  --primary: #70A1A8;    /* ミュートテイル */
  --secondary: #E8AFAA;  /* サーモンピンク */
  --accent: #77A07E;     /* オリーブグリーン */
  --cream: #F0E7D8;      /* 背景ベージュ */
  --text: #2D2D2D;       /* メインテキスト（視認性向上のため濃く変更） */
  --radius: 0px;         /* 角丸撤廃 */
}

/* 全体に角丸0を適用 */
* {
  border-radius: var(--radius) !important;
}

/* コンテンツ幅の調整 (約80%〜85%) */
.max-w-7xl, .content-container {
  max-width: 85% !important;
  margin-left: auto;
  margin-right: auto;
}

/* ページ全体の雰囲気調整 */
body {
  background-color: var(--cream);
  color: var(--text);
  line-height: 1.8;
}

/* フォントサイズの微調整 */
.footer-pref-link {
  font-size: 0.875rem !important; /* 約14px。以前の xs(12px)から拡大 */
  font-weight: 700;
}

/* モダンなボタン・カード */
.btn-primary {
  background-color: var(--primary);
  color: white;
  transition: all 0.3s;
  border: none;
}
.btn-primary:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

.card-european {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  transition: transform 0.3s, box-shadow 0.3s;
}
.card-european:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 30px -10px rgba(0,0,0,0.05);
}

/* Scroll to top ボタン */
#scrollTopBtn {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99;
  border: none;
  outline: none;
  background-color: transparent;
  color: var(--primary);
  cursor: pointer;
  padding: 0;
  display: none; /* JSで制御 */
  transition: 0.3s;
}
#scrollTopBtn:hover {
  transform: translateY(-5px);
  color: var(--secondary);
}

/* アニメーション用 */
.fade-in {
  animation: fadeIn 0.8s ease-in-out;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ================================================================
   スマートフォン向け Mobile UX 改善
   ================================================================ */

/* --- ドロワー開放中のbodyスクロール防止 --- */
body.drawer-open {
  overflow: hidden;
}

/* --- タップターゲット: 最小 44px を保証 --- */
@media (max-width: 1023px) {
  a, button, [role="button"] {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  /* ナビリンクは例外（フォーム内など）*/
  input, textarea, select {
    min-height: unset;
  }
}

/* --- コンテンツ幅: モバイルでは余白を確保しつつ広め --- */
@media (max-width: 767px) {
  .max-w-\[85\%\] {
    max-width: 95% !important;
  }
  /* ヒーロー見出しのフォントスケール */
  .text-7xl { font-size: 2.25rem !important; line-height: 1.1 !important; }
  .text-6xl { font-size: 2rem !important;    line-height: 1.15 !important; }
  .text-5xl { font-size: 1.75rem !important; line-height: 1.2 !important; }
  .text-4xl { font-size: 1.5rem !important;  line-height: 1.25 !important; }

  /* 統計数値カード: 2列グリッド化 */
  .hero-stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* 検索フォーム: 全幅 */
  form[action="/search"] input[name="q"] {
    width: 100% !important;
  }

  /* フッター: py を短縮 */
  footer.bg-slate-900 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  /* カード内の横並びを縦積みに */
  .mobile-stack {
    flex-direction: column !important;
  }
}

/* --- スクロールトップボタン: モバイルでは左下へ (Cookie同意と衝突回避) --- */
@media (max-width: 767px) {
  #scrollTopBtn {
    bottom: 5rem;
    right: 1rem;
  }
  #scrollTopBtn .material-symbols-outlined {
    font-size: 2rem;
  }
}

/* --- Cookie同意バナー: モバイルでフォント調整 --- */
@media (max-width: 767px) {
  #cookieConsent {
    padding: 1rem !important;
  }
}

/* --- アコーディオンアニメーション --- */
.mobile-accordion-content {
  overflow: hidden;
}
.mobile-accordion-content.is-open {
  display: block;
  animation: accordionOpen 0.2s ease-out;
}
@keyframes accordionOpen {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
