/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */



:root{
  --ls-yellow:#FFD800;
  --ls-navy:#27313F;
  --ls-navy-light:#3B5BA9;
  --ls-gray:#E5E7EB;
  --h2-size: clamp(1.3rem, 0.95rem + 1.6vw, 1.8rem);
  --h3-size: clamp(1.1rem, 0.9rem + 0.8vw, 1.3rem);
}

.hidden-block {
  display: none !important;
}

/* =====================
   ヘッダーロゴ・タイトル・キャッチ
===================== */
/* ロゴ＋タイトル＋キャッチ全体を hover 対象にする */
.ct-header .site-branding {
  cursor: pointer;
}

/* ホバー時：タイトルを黄色に */
.ct-header .site-branding:hover .site-title a {
  color: #c59d00;
}

/* ホバー時：キャッチも黄色に */
.ct-header .site-branding:hover .site-description {
  color: #c59d00;
}

/* ホバー時：ロゴ画像をより黄色に寄せる */
.ct-header .site-branding:hover .site-logo-container img {
  filter: brightness(1.45) saturate(2) hue-rotate(15deg);
  transition: filter 0.25s ease;
}

/* =====================
   開業ガイド（guide）
===================== */
.category-guide .entry-content .wp-block-stackable-heading:has(> h2.stk-block-heading__text){
  margin-top: 64px !important;   /* ← h2 の章前だけ広げる */
  margin-bottom: 24px;
}
.category-guide .entry-content .wp-block-stackable-heading:has(> h3.stk-block-heading__text){
  margin-top: 28px !important;
  margin-bottom: 16px;
}
.category-guide .entry-content h2{
  font-size: var(--h2-size);
  font-weight: 700;
  color: #27313F;
  background: #FFD800;
  padding: 10px 16px;
  border-radius: 4px;
  box-shadow:
    inset 0 2px 0 #FFE37A,
    inset 0 -2px 0 #FFE37A;
}

.category-guide .entry-content h3{
  font-size: var(--h3-size);
  font-weight: 600;
  color: #444;
  border-bottom: 2px solid var(--ls-yellow);
  padding-bottom: 6px;
  margin: 28px 0 16px;
}

/* =====================
   事例紹介（report）
===================== */
.category-report .entry-content .wp-block-stackable-heading:has(> h2.stk-block-heading__text){
  margin-top: 64px !important;
  margin-bottom: 24px;
}
.category-report .entry-content .wp-block-stackable-heading:has(> h3.stk-block-heading__text){
  margin-top: 28px !important;
  margin-bottom: 16px;
}
.category-report .entry-content h2{
  font-size: var(--h2-size);
  font-weight: 700;
  color: #fff;
  background: var(--ls-navy);
  padding: 10px 16px;
  border-radius: 4px;
  box-shadow:
    inset 0 2px 0 var(--ls-navy-light),
    inset 0 -2px 0 var(--ls-navy-light);
}

.category-report .entry-content h3{
  font-size: var(--h3-size);
  font-weight: 600;
  color: #27313F;
  border-bottom: 2px solid var(--ls-navy);
  padding-bottom: 6px;
  margin: 28px 0 16px;
}

/* ── 事例紹介（カテゴリ report）の Table(Adv) 共通スタイル ── */

/* ── 事例紹介（カテゴリ report）の Table(Adv) 用 安定＋縦中央寄せ 内包版 ── */

/* Table(Adv) ブロック全体に左右余白（横スクロール防止） */
body.single-post article.category-report .wp-block-kadence-table {
  padding: 0 1rem;
}

/* テーブル本体 */
body.single-post article.category-report .wp-block-kadence-table table {
  width: 100%;
  border-collapse: collapse;
}

/*    ▼ 通常セルのデザイン（背景・枠線・高さ）*/
body.single-post article.category-report .wp-block-kadence-table th,
body.single-post article.category-report .wp-block-kadence-table td {
  padding: 0.35em 1em !important;
  border: 1px solid #27313F !important;
  background-color: #FFFFFF !important;
  color: #27313F !important;
  vertical-align: middle !important; /* ← valign-middle取り込み */
}

/*    ▼ 1カラム目のデザイン（濃紺＋白文字）*/
body.single-post article.category-report 
  .wp-block-kadence-table tr > th:first-child,
body.single-post article.category-report
  .wp-block-kadence-table tr > td:first-child {
  background-color: #8E949B !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/*    ▼ valign-middle（縦中央寄せ） 内包
   ※ 既存スタイルを壊さず縦中央だけ正しくする */

/* セルの直下要素（ほぼ .kb-table-data）を inline-block にする */
body.single-post article.category-report .wp-block-kadence-table td > *,
body.single-post article.category-report .wp-block-kadence-table th > * {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

/* “高さ合わせ用の当て木” を追加して中央寄せを有効化 */
body.single-post article.category-report .wp-block-kadence-table td::before,
body.single-post article.category-report .wp-block-kadence-table th::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

/* Kadence Table(Adv) が内部に持つラッパーにも対応 */
body.single-post article.category-report .wp-block-kadence-table .kb-adv-table-cell-inner {
  display: inline-block;
  vertical-align: middle;
}



/* =====================
   FC詳細（compare）
===================== */
/* アイキャッチ画像の枠線を設定 */
.category-compare .wp-post-image {
  border: 1px solid #ccc;
  border-radius: 4px;
}

/* 色やサイズの変数（必要に応じて調整） */
:root{
  --ls-ink: #27313F;             /* 文字色（h2） */
  --ls-ink-weak: #444;           /* 文字色（h3） */
  --ls-yellow: #FFD800;          /* アクセント */
  --ls-h2-icon-size: 1.15em;     /* h2 アイコンサイズ */
  --ls-h3-icon-size: 1.00em;     /* h3 アイコンサイズ */
  --ls-icon-gap: 8px;            /* アイコンと文字の間隔 */
  --ls-h2-icon-url: url('/wp-content/uploads/icons/fc-h2.svg');
  --ls-h3-icon-url: url('/wp-content/uploads/icons/fc-h3.svg');
  /* PNGフォールバック（必要なら差し替え）
     --ls-h2-icon-url-png: url('/wp-content/uploads/icons/fc-h2.png');
     --ls-h3-icon-url-png: url('/wp-content/uploads/icons/fc-h3.png');
  */
}

/* h2 の直前は広め */
.category-compare .entry-content h2.stk-block-heading__text {
  margin-top: 64px !important;
  margin-bottom: 24px;
}

/* h2 スタイル（ガイドのトーンに寄せて微調整） */
.category-compare .entry-content h2{
  font-size: var(--h2-size, 1.6rem);
  font-weight: 700;
  color: var(--ls-ink);
  background: #FFD800;
  padding: 10px 16px 10px 14px;
  border-radius: 4px;
  box-shadow:
    inset 0 2px 0 #FFE37A,
    inset 0 -2px 0 #FFE37A;
	position: relative;
}

/* h3 スタイル（ガイドに準拠） */
.category-compare .entry-content h3{
  font-size: var(--h3-size, 1.25rem);
  font-weight: 600;
  color: var(--ls-ink-weak);
  border-bottom: 2px solid var(--ls-yellow);
  padding-bottom: 6px;
  margin: 28px 0 16px;
  position: relative;
}

/* 共通：先頭アイコン（SVGマスクで色＝currentColorに追従） */
.category-compare .entry-content h2::before,
.category-compare .entry-content h3::before{
  content: "";
  display: inline-block;
  vertical-align: -2px;
  margin-right: var(--ls-icon-gap);
  background: currentColor;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
}

/* h2 用の共通アイコン */
.category-compare .entry-content h2::before{
  width: var(--ls-h2-icon-size);
  height: var(--ls-h2-icon-size);
  -webkit-mask-image: var(--ls-h2-icon-url);
          mask-image: var(--ls-h2-icon-url);
}

/* h3 用の共通アイコン */
.category-compare .entry-content h3::before{
  width: var(--ls-h3-icon-size);
  height: var(--ls-h3-icon-size);
  -webkit-mask-image: var(--ls-h3-icon-url);
          mask-image: var(--ls-h3-icon-url);
}

/* FC・メーカー比較カードのタイトル高さ統一 */
.category-compare .wp-block-post-title {
  line-height: 1.4;  /* 現行のline-height基準。必要なら調整OK */
  min-height: calc(1.4em * 2);  /* ← 2行ぶん高さを確保 */
  display: block;
}


/* ===== フォールバック（mask未対応 or SVG非対応ブラウザ向け） ===== */
@supports not (-webkit-mask-image: none) and (mask-image: none) {
  /* 何もしない（環境判定の都合でスキップ） */
}

/* PNGに倒す場合は下記を有効化（上のmask指定は残っていてもOK、対応環境はmaskが優先） */
/*
.category-compare .entry-content h2::before{
  background: none;
  width: calc(var(--ls-h2-icon-size) * 1.2);
  height: calc(var(--ls-h2-icon-size) * 1.2);
  background-image: var(--ls-h2-icon-url-png);
  background-repeat: no-repeat;
  background-position: center left;
  background-size: contain;
}
.category-compare .entry-content h3::before{
  background: none;
  width: calc(var(--ls-h3-icon-size) * 1.2);
  height: calc(var(--ls-h3-icon-size) * 1.2);
  background-image: var(--ls-h3-icon-url-png);
  background-repeat: no-repeat;
  background-position: center left;
  background-size: contain;
}
*/


/* =====================
   Table(Adv) 親ブロックの「追加CSSクラス」に `valign-middle` を付ける
   Kadence Advanced Table 用（改行しても上の余白が増えない版）
===================== */

/* セル自体を縦中央寄せ＆行間を整える */
.valign-middle td,
.valign-middle th {
  vertical-align: middle;
  line-height: 1.4;     /* 好みで 1.3〜1.6 くらいで調整可 */
}

/* セル直下の要素の上下マージンをリセットして余白暴れ防止 */
.valign-middle td > *,
.valign-middle th > * {
  margin-top: 0;
  margin-bottom: 0;
}

/* 旧バージョンの ::before “当て木” ハックが残っていても無効化する保険 */
.valign-middle td::before,
.valign-middle th::before {
  content: none !important;
  display: none !important;
}

/* Kadence Table(Adv) のセル内ラッパーを flex 化して中身を縦中央に */
.valign-middle td > .kb-adv-table-cell-inner,
.valign-middle th > .kb-adv-table-cell-inner {
  display: flex;
  align-items: center;   /* 縦方向センター */
}

/* ラッパー内の要素もマージン調整＆横幅いっぱいにして自然な折り返しに */
.valign-middle td > .kb-adv-table-cell-inner > *,
.valign-middle th > .kb-adv-table-cell-inner > * {
  margin-top: 0;
  margin-bottom: 0;
  width: 100%;
}


/* ============================
   Table Header を改行させない共通クラス
   追加CSSクラス → table-header-nowrap
============================ */
/* PC / タブレット：ヘッダーは1行固定 */
.table-header-nowrap th {
  white-space: nowrap;
}

/* スマホは折り返しOK（横幅が狭いので崩壊防止） */
@media (max-width: 768px) {
  .table-header-nowrap th {
    white-space: normal;
  }
}

/* ============================
   Table(Adv) のバグでQueryLoopやInnerColumnの中に置くとFirst column is headerオプションが効かないバグを回避
   追加CSSクラス → ls-table-header-col
============================ */
/* ランドリー総研 概要テーブル：1列目を疑似ヘッダーとして装飾 */
.ls-table-header-col tbody tr td:first-child {
  font-weight: 700;              /* 太字 */
  text-align: center;            /* 中央寄せ */
  background-color: #fff5cc;     /* お好みで。#FFD800系を薄めると良い感じ */
}