/*
Theme Name:   Furoju Child
Description:  Astra 子テーマ — 株式会社フロジュ専用デザイン
Template:     astra
Version:      1.0.0
Author:       Furoju
Text Domain:  furoju-child
*/

/* =====================================================
   Furoju カラー変数
   ※ WordPress カスタマイザーより優先されます
===================================================== */
:root {
  --furoju-primary:    #1a3a5c;   /* 濃紺（ファイターズブルーベース） */
  --furoju-primary-d:  #12294a;   /* 濃紺ダーク（hover用） */
  --furoju-accent:     #c8a84b;   /* ゴールド */
  --furoju-accent-d:   #a8883b;   /* ゴールドダーク */
  --furoju-bg:         #f7f7f5;   /* 背景（オフホワイト） */
  --furoju-text:       #2d2d2d;
  --furoju-muted:      #666;
  --furoju-border:     #ddd;
  --furoju-white:      #ffffff;
  --furoju-radius:     6px;
  --furoju-shadow:     0 2px 12px rgba(0,0,0,.10);
  --furoju-max-width:  1100px;
}

/* =====================================================
   ページタイトルを非表示（コンテンツ内に見出しがあるため）
===================================================== */
.page .entry-title,
.page .entry-header .entry-title {
  display: none !important;
}
.page .entry-header {
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
}

/* =====================================================
   ベース
===================================================== */
body {
  background-color: var(--furoju-bg);
  color: var(--furoju-text);
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
}

/* =====================================================
   ヘッダー
===================================================== */
.site-header,
.ast-primary-header-bar,
#masthead {
  background-color: var(--furoju-primary) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
}

/* ロゴ・サイト名 */
.site-title a,
.ast-site-identity .site-title a {
  color: var(--furoju-white) !important;
  font-weight: 700;
  letter-spacing: .05em;
}

/* キャッチフレーズ */
.site-description {
  color: rgba(255,255,255,.75) !important;
  font-size: .8rem;
}

/* =====================================================
   ナビゲーション
===================================================== */
.main-navigation a,
.ast-primary-header-bar .main-navigation a,
#site-navigation .menu-item a {
  color: var(--furoju-white) !important;
  font-size: .9rem;
  padding: 8px 14px;
  border-radius: var(--furoju-radius);
  transition: background .2s;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
  background: rgba(255,255,255,.15) !important;
  color: var(--furoju-white) !important;
}

/* =====================================================
   ボタン共通
===================================================== */
.ast-button,
.wp-block-button .wp-block-button__link,
input[type="submit"],
button[type="submit"],
.elementor-button {
  background-color: var(--furoju-accent) !important;
  color: var(--furoju-primary) !important;
  border: none !important;
  border-radius: 40px !important;
  font-weight: 700 !important;
  padding: 12px 32px !important;
  transition: transform .15s, box-shadow .15s, background .2s !important;
}

.ast-button:hover,
.wp-block-button .wp-block-button__link:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.elementor-button:hover {
  background-color: var(--furoju-accent-d) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.15) !important;
}

/* アウトラインボタン */
.btn-outline-furoju {
  background: transparent !important;
  border: 2px solid var(--furoju-white) !important;
  color: var(--furoju-white) !important;
}

/* =====================================================
   リンク
===================================================== */
a { color: var(--furoju-primary); }
a:hover { color: var(--furoju-accent); }

/* =====================================================
   見出し
===================================================== */
h1, h2, h3, h4 {
  color: var(--furoju-primary);
}

/* セクションタイトル（Elementor 見出しウィジェットに .section-title クラスを追加して使用） */
.section-title {
  text-align: center;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--furoju-primary);
  margin-bottom: 8px;
}

.section-title::after {
  content: '';
  display: block;
  width: 48px;
  height: 3px;
  background: var(--furoju-accent);
  margin: 12px auto 0;
  border-radius: 2px;
}

.section-subtitle {
  text-align: center;
  color: var(--furoju-muted);
  margin-bottom: 40px;
  font-size: .95rem;
}

/* =====================================================
   ヒーローセクション（Elementor セクションに .furoju-hero クラスを追加）
===================================================== */
.furoju-hero {
  background: linear-gradient(135deg, var(--furoju-primary) 0%, #2a5f9e 100%) !important;
  padding: 96px 24px !important;
  text-align: center;
}

.furoju-hero h1,
.furuju-hero .elementor-heading-title {
  color: var(--furoju-white) !important;
  font-size: clamp(1.8rem, 4vw, 3rem) !important;
  line-height: 1.35 !important;
}

.furoju-hero p,
.furoju-hero .elementor-widget-text-editor {
  color: rgba(255,255,255,.85) !important;
}

/* =====================================================
   エスコンセクション（Elementor セクションに .furoju-escon クラスを追加）
===================================================== */
.furoju-escon {
  background: linear-gradient(135deg, #0a1f3c 0%, #1a3a5c 100%) !important;
}

.furoju-escon h2,
.furoju-escon h3,
.furoju-escon .elementor-heading-title {
  color: var(--furoju-white) !important;
}

.furoju-escon p,
.furoju-escon .elementor-widget-text-editor {
  color: rgba(255,255,255,.85) !important;
}

/* =====================================================
   物件カード（.furoju-card クラスを追加）
===================================================== */
.furoju-card {
  background: var(--furoju-white);
  border-radius: var(--furoju-radius);
  box-shadow: var(--furoju-shadow);
  overflow: hidden;
  transition: transform .2s;
}

.furoju-card:hover { transform: translateY(-4px); }

/* タグ */
.tag-rent {
  display: inline-block;
  background: #e8f0fb;
  color: #1a5cb8;
  font-size: .75rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 8px;
}

.tag-parking {
  display: inline-block;
  background: #e9f7ef;
  color: #1a7c45;
  font-size: .75rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 8px;
}

/* =====================================================
   強みカード（.furoju-feature クラスを追加）
===================================================== */
.furoju-feature {
  background: var(--furoju-white);
  border-radius: var(--furoju-radius);
  padding: 32px 24px;
  box-shadow: var(--furoju-shadow);
  text-align: center;
  transition: transform .2s;
}

.furoju-feature:hover { transform: translateY(-4px); }

/* =====================================================
   お問い合わせフォーム（Contact Form 7）
===================================================== */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--furoju-border);
  border-radius: var(--furoju-radius);
  font-family: inherit;
  font-size: .95rem;
  transition: border-color .2s;
  background: var(--furoju-white);
}

.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  outline: none;
  border-color: var(--furoju-primary);
  box-shadow: 0 0 0 3px rgba(26,58,92,.1);
}

.wpcf7-form input[type="submit"] {
  background: var(--furoju-primary) !important;
  color: var(--furoju-white) !important;
  border: none;
  padding: 14px 40px !important;
  border-radius: 40px !important;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s, transform .15s;
}

.wpcf7-form input[type="submit"]:hover {
  background: var(--furoju-primary-d) !important;
  transform: translateY(-2px);
}

/* CF7 エラー・成功メッセージ */
.wpcf7-response-output {
  border-radius: var(--furoju-radius);
  padding: 12px 16px;
  font-size: .9rem;
  margin-top: 12px;
}

/* =====================================================
   エリア切り替えタブ（Elementor タブウィジェット）
===================================================== */
.elementor-tab-title {
  background: var(--furoju-bg) !important;
  color: var(--furoju-primary) !important;
  border: 2px solid var(--furoju-border) !important;
  border-radius: var(--furoju-radius) !important;
  font-weight: 700 !important;
  transition: all .2s !important;
}

.elementor-tab-title.elementor-active {
  background: var(--furoju-primary) !important;
  color: var(--furoju-white) !important;
  border-color: var(--furoju-primary) !important;
}

/* =====================================================
   フッター
===================================================== */
.site-footer,
#colophon {
  background-color: var(--furoju-primary) !important;
  color: rgba(255,255,255,.75) !important;
}

.site-footer a,
#colophon a {
  color: rgba(255,255,255,.75) !important;
}

.site-footer a:hover,
#colophon a:hover {
  color: var(--furoju-accent) !important;
}

.site-footer .widget-title,
#colophon .widget-title {
  color: var(--furoju-white) !important;
  border-bottom: 1px solid rgba(255,255,255,.2);
  padding-bottom: 8px;
  margin-bottom: 14px;
}

/* =====================================================
   ブログ（投稿一覧）
===================================================== */
.ast-article-post,
.post,
.ast-grid-post-layout-container .post {
  background: var(--furoju-white);
  border-radius: var(--furoju-radius);
  box-shadow: var(--furoju-shadow);
  transition: transform .2s;
}

.ast-article-post:hover { transform: translateY(-3px); }

/* カテゴリラベル */
.ast-blog-featured-section .cat-links a,
.entry-meta .cat-links a {
  background: var(--furoju-primary);
  color: var(--furoju-white) !important;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: .75rem;
  font-weight: 700;
}

/* READ MORE リンク */
.ast-read-more {
  color: var(--furoju-primary) !important;
  font-weight: 700;
}

/* =====================================================
   ページヒーロー（各下層ページ上部）
   Elementor セクションに .furoju-page-hero を追加
===================================================== */
.furoju-page-hero {
  background: linear-gradient(135deg, var(--furoju-primary) 0%, #2a5f9e 100%) !important;
  padding: 56px 24px !important;
  text-align: center;
}

.furoju-page-hero .elementor-heading-title {
  color: var(--furoju-white) !important;
  font-size: 2rem !important;
}

/* =====================================================
   Yoast SEO パンくずリスト
===================================================== */
.ast-breadcrumbs-wrapper,
.breadcrumb-trail {
  font-size: .8rem;
  color: var(--furoju-muted);
}

/* =====================================================
   モバイル全体（〜600px）— グリッドをすべて縦積みに
===================================================== */
@media (max-width: 600px) {

  /* ===== コンテンツ内の全グリッドを1列に ===== */
  .entry-content div[style*="display:grid"],
  .entry-content div[style*="display: grid"] {
    display: block !important;
  }
  /* グリッド直下の子要素に間隔を付ける */
  .entry-content div[style*="display:grid"] > div,
  .entry-content div[style*="display: grid"] > div,
  .entry-content div[style*="display:grid"] > a,
  .entry-content div[style*="display: grid"] > a {
    width: 100% !important;
    margin-bottom: 16px !important;
    box-sizing: border-box !important;
  }

  /* ===== ヒーローセクション ===== */
  .entry-content .furoju-hero,
  .entry-content div[style*="padding:96px"] {
    padding: 48px 16px !important;
  }
  .entry-content div[style*="padding:96px"] h1 {
    font-size: 1.55rem !important;
    line-height: 1.4 !important;
  }
  /* ヒーローボタン（flex）も縦積み */
  .entry-content div[style*="display:flex"][style*="gap:16px"],
  .entry-content div[style*="display:flex"][style*="gap: 16px"] {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .entry-content div[style*="display:flex"] > a[style*="border-radius:40px"] {
    text-align: center !important;
  }

  /* ===== セクション余白を縮小 ===== */
  .entry-content > div[style*="padding:72px"],
  .entry-content > div[style*="padding: 72px"],
  .entry-content > div[style*="padding:56px"],
  .entry-content > div[style*="padding: 56px"] {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* ===== 見出しサイズ ===== */
  .entry-content h2[style*="font-size:1.75rem"],
  .entry-content h2[style*="font-size: 1.75rem"] {
    font-size: 1.3rem !important;
  }

  /* ===== テーブル（物件詳細スペック） ===== */
  .entry-content table {
    width: 100% !important;
    font-size: .85rem !important;
  }
  .entry-content table th,
  .entry-content table td {
    padding: 8px 10px !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .entry-content table th {
    background: #1a3a5c !important;
    color: white !important;
    border-bottom: none !important;
  }
  .entry-content table td {
    border-bottom: 1px solid #eee !important;
  }

  /* ===== 問い合わせフォーム（CF7） ===== */
  .wpcf7-form {
    padding: 0 4px !important;
  }
  .wpcf7-form p {
    margin-bottom: 16px !important;
  }
  .wpcf7-form label {
    font-size: .9rem !important;
    font-weight: 700 !important;
    color: #1a3a5c !important;
    display: block !important;
    margin-bottom: 6px !important;
  }
  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form input[type="tel"],
  .wpcf7-form select,
  .wpcf7-form textarea {
    font-size: 16px !important;  /* iOS でズームしないサイズ */
    padding: 12px 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 6px !important;
  }
  .wpcf7-form textarea {
    min-height: 120px !important;
  }
  .wpcf7-form input[type="submit"] {
    width: 100% !important;
    font-size: 1rem !important;
    padding: 16px !important;
  }
}

/* =====================================================
   レスポンシブ（768px以下）
===================================================== */
@media (max-width: 768px) {
  .furoju-hero {
    padding: 64px 20px !important;
  }

  .furoju-hero h1,
  .furoju-hero .elementor-heading-title {
    font-size: 1.7rem !important;
  }

  .section-title { font-size: 1.4rem; }

  /* ヘッダー：サイト名を1行に収める＋キャッチフレーズを非表示 */
  .site-title a,
  .ast-site-identity .site-title a {
    font-size: .9rem !important;
    white-space: nowrap;
  }
  .site-description {
    display: none !important;
  }
  .ast-site-identity {
    max-width: calc(100vw - 70px);
    overflow: hidden;
  }
}

/* =====================================================
   モバイルハンバーガーメニュー（Astra実構造に対応）
===================================================== */

/* ハンバーガーボタンのアイコン色 */
button.menu-toggle.ast-mobile-menu-trigger-minimal,
button.main-header-menu-toggle {
  color: white !important;
  background: transparent !important;
  border: none !important;
}
button.menu-toggle.ast-mobile-menu-trigger-minimal svg,
button.main-header-menu-toggle svg {
  fill: white !important;
  color: white !important;
}

/* モバイルメニュー展開パネル全体の背景を紺色に */
.ast-mobile-header-content,
#ast-mobile-header .ast-mobile-header-content {
  background-color: #1a3a5c !important;
}

/* メニューコンテナ */
#ast-hf-mobile-menu,
#ast-mobile-site-navigation,
.ast-builder-menu-mobile .main-navigation,
.ast-mobile-header-content .main-header-bar-navigation,
.ast-mobile-header-content nav,
.ast-mobile-header-content ul,
.ast-mobile-header-content li {
  background-color: #1a3a5c !important;
}

/* メニュー項目のリンク — 文字を紺色に */
.ast-mobile-header-content .main-navigation a,
#ast-hf-mobile-menu a,
#ast-mobile-site-navigation a,
.ast-mobile-header-content a {
  color: #1a3a5c !important;
  border-bottom: 1px solid #ddd !important;
  padding: 14px 20px !important;
  display: block !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
}

/* アクティブ項目 */
.ast-mobile-header-content .current-menu-item > a,
.ast-mobile-header-content .current_page_item > a {
  color: #c8a84b !important;
}