/*
Theme Name: 情熱アシスト
Theme URI: https://broad-arts.co.jp/
Author: Broad Arts
Author URI: https://broad-arts.co.jp/
Description: 40代経営者・クリエイター・フリーランス向け自然系LPテーマ。全セクション全幅・背景・ボックス切替対応。
Version: 1.0
*/

:root {
  --main-color: #5ca870;
  --sub-color: #a8885c;
  --base-bg: #f8faf7;
  --base-txt: #243;
  --accent-bg: #f5f2ea;
}

/* 全体リセット＆ベース設定 */
html, body {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", "Helvetica Neue", Arial, sans-serif;
  color: var(--base-txt);
  background: var(--base-bg);
  line-height: 1.75;
  overflow-x: hidden !important;
}

/* 全幅セクション（はみ出し解消） */
.lp-section.fullwidth {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  box-sizing: border-box;
  overflow: hidden;
}

/* 中央ボックス幅（全幅・ボックス共通） */
.lp-section-inner,
.lp-hero-inner,
.lp-problem-inner,
.lp-features-inner,
.lp-voice-inner,
.lp-faq-inner,
.lp-price-inner,
.lp-profile-inner,
.lp-contact-inner,
.lp-special-inner,
.lp-trust-inner,
.lp-access-inner,
.lp-free-inner {
  max-width: 950px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  padding: 3em 1em; /* Default padding for desktop */
  box-sizing: border-box;
  background: none !important;
}

/* セクションタイトル */
.lp-section h2,
.lp-hero-title,
.lp-problem-title,
.lp-features-title,
.lp-voice-title,
.lp-faq-title,
.lp-price-title,
.lp-profile-title,
.lp-contact-title,
.lp-special-title,
.lp-trust-title,
.lp-access-title {
  font-size: 2.1rem;
  font-weight: 700;
  margin: 0 0 1em 0;
  letter-spacing: 0.03em;
  color: #225;
  text-align: center;
  line-height: 1.3;
}

/* サブリード文など */
.lp-section .lp-section-lead,
.lp-hero-sub,
.lp-problem-lead,
.lp-features-lead,
.lp-voice-lead,
.lp-faq-lead,
.lp-price-lead,
.lp-profile-lead,
.lp-contact-lead,
.lp-special-lead,
.lp-trust-lead,
.lp-access-lead {
  font-size: 1.1em;
  color: #4d6650;
  margin-bottom: 1.7em;
  text-align: center;
}

/* ボタン系 */
.lp-btn,
.lp-hero-btn {
  display: inline-block;
  padding: 1em 2.5em;
  font-size: 1.08em;
  border-radius: 2em;
  background: var(--main-color, #5ca870);
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  transition: background 0.2s, box-shadow 0.2s;
  box-shadow: 0 2px 12px rgba(90,140,80,0.10);
  margin-top: 0.8em;
}
.lp-btn:hover,
.lp-hero-btn:hover {
  background: #4e8c5c;
  color: #fff;
}

/* 背景動画用 */
.lp-bg-video {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
}

/* サムネイル画像など */
.lp-hero-image img,
.lp-features-image img,
.lp-solution-image img {
  display: block;
  margin: 0 auto;
  border-radius: 1em;
  box-shadow: 0 2px 12px rgba(80, 120, 80, 0.09);
}

/* お客様の声・カードレイアウト */
.lp-voice-list,
.lp-price-list,
.lp-special-list,
.lp-trust-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2em;
  justify-content: center;
}

/* 汎用カード */
.lp-voice-card,
.lp-price-card,
.lp-special-card,
.lp-trust-card {
  background: #fff;
  border-radius: 1em;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  padding: 1.7em 1.3em;
  width: 270px;
  min-height: 120px;
  text-align: center;
}

/* FAQ（Q/A）レイアウト */
.lp-faq-item {
  background: #f9f9f7;
  border-radius: 0.8em;
  margin-bottom: 1.4em;
  padding: 1.1em 1.2em;
}
.lp-faq-q { font-weight: bold; color: #225; margin-bottom: 0.5em; }
.lp-faq-a { color: #455; }

/* プロフィール画像 */
.lp-profile-image img {
  width: 160px;
  max-width: 100%;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(100,100,120,0.06);
}

/* フリースペース汎用 */
.lp-free-inner {
  text-align: center;
  font-size: 1.1em;
}

/* メディアクエリ（スマホ） */
@media (max-width: 700px) {
  .lp-section-inner,
  .lp-hero-inner,
  .lp-problem-inner,
  .lp-features-inner,
  .lp-voice-inner,
  .lp-faq-inner,
  .lp-price-inner,
  /* .lp-profile-inner, */ /* Removed from general rule */
  .lp-contact-inner,
  .lp-special-inner,
  .lp-trust-inner,
  .lp-access-inner,
  .lp-free-inner {
    max-width: 98vw;
    padding: 1.1em 0.5em; /* Halved padding for most sections */
  }

  /* Specific padding for solution and profile sections on mobile */
  .lp-solution-inner,
  .lp-profile-inner {
    padding: 2.5em 1em !important; /* Increased padding, using !important to ensure override if needed */
  }

  .lp-section h2,
  .lp-hero-title,
  .lp-problem-title,
  .lp-features-title {
    font-size: 1.3rem;
  }
  .lp-btn, .lp-hero-btn {
    font-size: 0.97em;
    padding: 0.9em 1.2em;
  }
  .lp-voice-card,
  .lp-price-card,
  .lp-special-card,
  .lp-trust-card {
    width: 94vw;
    min-width: unset;
    padding: 1.1em 0.5em;
  }
}

/* フッターメニュー装飾 */
.footer-navigation {
    margin-bottom: 1em;
}

.footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1em 1.5em; /* 縦方向のギャップと横方向のギャップ */
}

.footer-menu li {
    display: inline-block; /* 横並びにする */
}

.footer-menu li a {
    color: #555; /* 少し濃いめのグレー */
    text-decoration: none;
    font-size: 0.9em;
    padding: 0.3em 0.5em;
    border-radius: 4px;
    transition: color 0.2s, background-color 0.2s;
}

.footer-menu li a:hover {
    color: var(--main-color);
    background-color: rgba(92, 168, 112, 0.1); /* メインカラーの薄い背景色 */
}

/* ユーティリティ */
.clearfix::after { content: ""; display: table; clear: both; }
a { color: var(--main-color); text-decoration: none; }
a:hover { text-decoration: underline; }