/*
 Theme Name: Cocoon Child Golfit
 Template: cocoon-master
 Version: 1.0
 Description: Golfit用ミニマル上質デザイン
*/

/* フォント（Noto Sans JP：太字まで） */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;800;900&display=swap');

/* ===== Base tokens ===== */
:root{
  --ink:#111827;          /* 本文色 */
  --accent:#0E3B2E;       /* リンク/ボタン色（濃緑） */
  --bg:#F7F6F2;           /* 背景アイボリー */
  --line:#e9e9e9;         /* 罫線 */
  --radius:14px;
  --shadow:0 4px 14px rgba(0,0,0,.06);
  --max:72ch;             /* 本文最大行幅 */
}

/* 合成ボールド許可（保険） */
html{ font-synthesis: weight style; }

/* ===== Base ===== */
body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Noto Sans JP",system-ui,-apple-system,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  font-weight:400;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.entry-content{ max-width:var(--max); margin-inline:auto; }
.entry-content p{ margin:1.05em 0; font-size:16.5px; }
.entry-content img{ border-radius:12px; box-shadow:var(--shadow); }

/* 見出しは Sans に統一 */
.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,.entry-content h5,.entry-content h6,
.article h1,.article h2,.article h3,.article h4,.article h5,.article h6{
  font-family:"Noto Sans JP",system-ui,-apple-system,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif !important;
  letter-spacing:.01em;
}

/* ===== Headings ===== */
/* H2：黒ラベル＋白字（角丸なし・高さ控えめ） */
.entry-content h2,.article h2{
  background:#111827 !important;
  color:#fff !important;
  padding:.42em .72em !important;
  border-radius:0 !important;
  margin:2.0em 0 1.0em !important;
  border:none !important;
  box-shadow:none !important;
  position:relative;
}
.entry-content h2::before,.article h2::before,
.entry-content h2::after,.article h2::after{ content:none !important; }

/* H3：テキスト行幅いっぱいのボーダー */
.entry-content h3,.article h3{
  margin:1.8em 0 .9em !important;
  padding:0 0 .35em !important;
  border:none !important;
  text-decoration:none !important;
  border-bottom:2px solid #111827 !important;
}
.entry-content h3::before,.article h3::before,
.entry-content h3::after,.article h3::after{ content:none !important; }

/* ===== Links ===== */
.entry-content a{
  color:#0B5C4A;
  text-decoration:underline;
  text-underline-offset:.14em;
  text-decoration-thickness:.1em;
}
.entry-content a:hover{ color:#094C3D; text-decoration-thickness:.12em; }
.entry-content a:visited{ color:#084C3B; }

/* ===== Emphasis (Bold) ===== */
.entry-content strong,.entry-content b,
.entry-content p strong,.entry-content p b,
.entry-content li strong,.entry-content li b,
.entry-content td strong,.entry-content td b{
  font-weight:800 !important; letter-spacing:.01em;
}
/* 見出し内の strong は見出しの太さに合わせる */
.entry-content h1 strong,.entry-content h2 strong,.entry-content h3 strong,.entry-content h4 strong{
  font-weight:inherit !important;
}

/* ===== TOC ===== */
.toc,.toc-widget{
  background:#fff !important;
  border:1px solid var(--line) !important;
  border-radius:12px !important;
  box-shadow:var(--shadow);
  padding:16px 18px !important;
}
.toc-title{ font-weight:700; color:var(--accent) !important; margin-bottom:6px !important; }

/* ===== Buttons ===== */
.wp-block-button .wp-block-button__link,
a.button,.btn,.entry-content .btn{
  background:var(--accent) !important;
  color:#fff !important;
  border:none !important;
  border-radius:999px !important;
  padding:.8em 1.3em !important;
  font-weight:700 !important;
  box-shadow:var(--shadow);
}
.wp-block-button.is-style-outline .wp-block-button__link,
a.button.outline,.btn.outline{
  background:transparent !important;
  color:var(--accent) !important;
  border:2px solid var(--accent) !important;
}

/* ===== Blockquote ===== */
.entry-content blockquote{
  background:#fff;
  border-left:5px solid var(--accent);
  padding:16px 18px;
  border-radius:12px;
  box-shadow:var(--shadow);
}

/* ===== Table ===== */
.entry-content table{
  width:100%;
  background:#fff;
  border-radius:12px;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.entry-content th,.entry-content td{ padding:10px 12px; border-bottom:1px solid #f0f0f0; }
.entry-content thead th{ background:#fafafa; font-weight:700; }

/* ===== Lists ===== */
.entry-content ul,.entry-content ol{ margin:1em 0 1.2em 1.2em; }
.entry-content li{ margin:.35em 0; }

/* ===== Sidebar (mobile off) ===== */
@media (max-width:1024px){
  #sidebar{ display:none; }
}

/* ===== CTA box（記事内で class="golfit-cta" を付与） ===== */
.golfit-cta{
  background:linear-gradient(180deg,#fff,#fafafa);
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
  box-shadow:var(--shadow);
}
.golfit-cta .actions{ display:flex; gap:12px; flex-wrap:wrap; }

/* ===== Cards/Widgets ===== */
.card,.widget,.related-entry-card{
  border-radius:12px !important;
  box-shadow:0 3px 10px rgba(0,0,0,.05) !important;
  border-color:var(--line) !important;
}

/* ===== CTA｜スリム＆上質版 ===== */
.golfit-cta.slim{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 3px 10px rgba(0,0,0,.04);
  padding:18px 20px;
  display:grid;
  grid-template-columns: 1fr auto;
  align-items:center;
  gap:16px;
}
.golfit-cta.slim h4{
  margin:0 0 .35rem;
  font-weight:800;
  padding:0;
  border:0 !important;            /* 見出し下線などを無効化 */
}
.golfit-cta.slim p{ margin:0; color:#4b5563; }
.golfit-cta.slim .cta-actions{ display:flex; gap:10px; }

.golfit-cta.slim .cta-btn{
  display:inline-block;
  padding:.65em 1.1em;
  font-weight:700;
  text-decoration:none;
  border-radius:9px;               /* 角は控えめに */
  line-height:1.1;
}
.golfit-cta.slim .cta-btn.primary{
  background:var(--accent);
  color:#fff;
}
.golfit-cta.slim .cta-btn.ghost{
  background:transparent;
  color:var(--accent);
  border:1.5px solid var(--accent);
}
.golfit-cta.slim .cta-btn:hover{ filter:brightness(.97); }

/* モバイルは縦積み＆ボタンを並べて押しやすく */
@media (max-width: 768px){
  .golfit-cta.slim{ grid-template-columns: 1fr; }
  .golfit-cta.slim .cta-actions{ flex-wrap:wrap; }
  .golfit-cta.slim .cta-btn{ flex:1; text-align:center; }
}
/* ===== Global Nav（最小ナビ＆右寄せ＋下線ホバー） ===== */
#navi{ background:transparent; border:none; box-shadow:none; }
#navi .navi-in{ padding:6px 0; }
#navi ul{ display:flex; gap:18px; justify-content:flex-end; align-items:center; }
#navi a{
  color:var(--ink); text-decoration:none; font-weight:600;
  padding:6px 8px; line-height:1;
}
#navi a:hover{ text-decoration:underline; text-underline-offset:.18em; }

/* 「体験予約」だけPillボタン化（メニュー項目にCSSクラス `btn-cta` を付与） */
#navi a.btn-cta{
  background:var(--accent); color:#fff !important;
  padding:.5em .9em; border-radius:999px; font-weight:700;
}
#navi a.btn-cta:hover{ filter:brightness(.95); }

/* =========================================
   Golfit Header — Clean Set (replace-only)
   前提: Cocoon「ヘッダーレイアウト＝トップメニュー」
   PC: ロゴ左 / メニュー右
   SP: ロゴ中央 / 上部ナビ非表示（下部固定メニュー使用）
   ========================================= */

/* 0) ヘッダー土台（余白・罫線の一元化） */
.header-container{
  background:#fff;
  border-bottom:1px solid #eee;
  padding:0;                       /* 右/左の“盛り”は使わない */
}
#header{ background:#fff; border-bottom:none; }

/* 1) 1行レイアウト（PC） */
#header-in, .header-in{
  max-width: var(--site-max, 1200px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;  /* ロゴ左／ナビ右 */
  gap: 20px;
  padding: 8px 16px;               /* ヘッダー上下の余白はここで管理 */
}

/* 2) ロゴ */
.header-in .logo{ margin:0; line-height:1; }
.header-in .logo img{ height:48px; width:auto; display:block; }

/* 3) グローバルナビ（PCのみ表示） */
#navi{
  position: static;
  background:transparent;
  border:0;
  box-shadow:none;
  margin:0;
}
#navi .navi-in{ padding:0; }
#navi ul{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:16px;                        /* メニュー間隔はここで固定 */
  white-space:nowrap;
}
#navi ul > li{ margin:0; }
#navi ul > li > a{
  color:#111827;
  text-decoration:none;
  font-weight:600;
  padding:6px 6px;
  line-height:1;
}

/* 4) CTA（必要なら li に .btn-cta クラスを付与） */
#navi li.btn-cta > a{
  background:#177055;
  color:#fff;
  font-weight:700;
  font-size:0.95rem;
  line-height:1;
  padding:.36em .8em;
  border-radius:10px;
  box-shadow:0 3px 8px rgba(0,0,0,.06);
  transition:transform .12s ease, filter .2s ease;
}
#navi li.btn-cta > a:hover{
  transform: translateY(-1px);
  filter: brightness(.95);
}

/* 5) SPルール（1025px以下）— ロゴ中央／上部ナビ非表示 */
@media (max-width:1025px){
  #header-in, .header-in{ justify-content:center; }
  #navi{ display:none !important; }
}

/* 6) ちょい調整（任意） */
@media (max-width:768px){
  .header-in .logo img{ height:44px; }
}

/* Header: 不要な縦方向のスキマを撤去 */
#header-in{
  gap: 0 !important;      /* shorthandで一括ゼロ */
  row-gap: 0 !important;  /* 念のため明示（flex-direction: column対策） */
}

/* ===== Header Logo Sizing ===== */
#header .logo img,
#header .site-title a img,
#header .site-branding img{
  height:auto;
  width:auto;
  max-height:40px;   /* PC表示 */
}

@media (max-width:1024px){
  #header .logo img,
  #header .site-title a img,
  #header .site-branding img{
    max-height:48px; /* SP表示 */
  }
}

/* PCだけヘッダーの上下に余白を足す（くっつき解消） */
@media (min-width:1025px){
  #header-in{ padding-top:20px; padding-bottom:20px; }
}

/* SP：ヘッダー上下の余白を増やす */
@media (max-width:1024px){
  #header-in{
    padding-top:14px;
    padding-bottom:14px;
  }
}

/* === SPで本文の下にサイドバーを表示（幅は現状維持） === */
@media (max-width: 767px){
  #sidebar, .sidebar, .l-sidebar {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    float: none !important;
    margin-top: 16px !important; /* 本文との余白だけ追加 */
  }

  /* 親コンテナがflexやfloatなら縦積みにする */
  .contents, #container, #content-in, .l-content {
    display: block !important;
  }
}

/* 本文とタイトル・CTA・関連記事の左端を揃える */
@media (min-width:1025px){
  .entry-content{
    max-width:none;      /* 中央寄せ解除 */
    margin-inline:0;     /* 左右の自動余白解除 */
  }
}

/* =========================
   サイドバー：カテゴリー調整（完全差し替え版）
   ========================= */

/* 見出し「カテゴリー」：黒背景・白文字・中央寄せ・角丸なし */
#sidebar .widget_categories .widget-title{
  background:#000;
  color:#fff;
  text-align:center;
  font-weight:700;
  padding:10px 12px;
  margin:0 0 10px;
  border:none;
  border-radius:0;
}

/* リスト全体：左に寄りすぎ防止 */
#sidebar .widget_categories ul{
  list-style:none;
  margin:0;
  padding:0 16px; /* 左右に余白を均一付与 */
}

/* 各カテゴリリンク：縦中央揃え＆行の高さを統一 */
#sidebar .widget_categories ul li a{
  display:flex;
  align-items:center;
  min-height:42px;     /* 行高さ */
  padding:8px 0;       /* 上下の余白 */
  text-decoration:none;
  color:#111827;
  padding-left:0;      /* Cocoon既定の左余白を打ち消す */
}

/* Cocoon既定のアイコン（:before）を消す */
#sidebar .widget_categories ul li a::before{
  content:none;
}

/* テキスト(span)の位置微調整 */
#sidebar .widget_categories ul li a .list-item-caption{
  line-height:1.5;
  padding-left:4px; /* 左に寄りすぎ解消 */
}