/* ==========================================================================
   wp.css
   WordPress化に伴う追加スタイル。site.css の「後」に読み込まれます。
     1. 元HTMLのインラインstyleをクラス化したもの
     2. ブロック（details / list / search など）を元デザインに合わせるもの
     3. 投稿・アーカイブなど、静的HTMLには無かったページのデザイン
     4. Contact Form 7 の補完
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 元HTMLのインラインstyleをクラス化
   -------------------------------------------------------------------------- */

/* 会社概要「COMPANY」ラベル（濃い背景の上に載るため淡いゴールド） */
.kicker--light { color: var(--gold-light); }

/* 幅を絞ったテキストブロック */
.narrow-780 { max-width: 780px; }

/* 本文の淡色テキスト */
.muted-70 { color: rgba(26, 42, 30, 0.70); }

/* コンサルページ「専門家連携」の小見出し */
.lead-h3 { margin-bottom: 24px; font-weight: 500; }

/* コンサルページ：連携先の2カラムグリッド */
.partner-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px 30px;
}
.partner-name { font-weight: 600; margin-bottom: 8px; }
.partner-desc { color: rgba(26, 42, 30, 0.70); font-size: 0.9rem; }

@media (max-width: 560px) {
	.partner-grid { grid-template-columns: 1fr; }
}

/* サービスカードを載せるセクションの淡い背景 */
.services-section { background: rgba(26, 92, 46, 0.02); }
.services-head .muted { margin-top: 14px; }

/* 箇条書き（対応領域 / 進め方） */
.styled-list {
	display: grid;
	gap: 14px;
	color: rgba(26, 42, 30, 0.70);
	list-style: none;
	padding-left: 0;
}
.styled-list--steps { gap: 18px; }
.styled-list .kicker { margin-right: 8px; }
/* 親テーマの `:root :where(.wp-block-list li) { margin-top: .5rem }` を打ち消し、
   元デザインどおり gap だけで間隔を取る */
.wp-site-blocks .styled-list li { margin-top: 0; }

/* お問い合わせページ：右カラム */
.callout--mt { margin-top: 18px; }
.callout-tel {
	color: var(--green);
	text-decoration: none;
	border-bottom: 1px solid rgba(26, 92, 46, 0.18);
	font-size: 1.15rem;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.callout-note { font-size: 0.82rem; color: var(--muted); }
.callout-note-sm { font-size: 0.8rem; }
.contact-map-wrap { margin-top: 30px; }
.sfs-admin-note {
	margin-top: 14px;
	padding: 10px 14px;
	font-size: 0.8rem;
	border: 1px dashed rgba(200, 168, 78, 0.6);
	border-radius: 4px;
	background: rgba(245, 236, 211, 0.25);
}
.form-lead { margin-bottom: 30px; font-size: 0.92rem; }

/* 「TOPへ戻る」用アンカー（元HTMLの body#top 相当） */
.sfs-top-anchor {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
}

/* --------------------------------------------------------------------------
   2. ブロックを元デザインに合わせる
   -------------------------------------------------------------------------- */

/* WordPress のフローレイアウトは
   `:root :where(.is-layout-flow) > :first-child / :last-child` で
   先頭・末尾の子要素のマージンを 0 にする（詳細度 0-2-0）。
   これが元CSSの `.split-text h2`（0-1-1）などに勝ってしまうため、元デザインの余白を戻す。
   ※ グループブロックの中に要素が1つだけのとき（.section-title など）に効いてきます。 */
.wp-site-blocks .split-text .section-title h2 { margin: 26px 0; }
.wp-site-blocks .company-info-content h3 { margin-bottom: 20px; }

/* 固定ヘッダーに隠れないよう、ページヒーローが無いページには余白を付ける */
.site-main:not(:has(.page-hero)):not(:has(.hero)) { padding-top: 140px; }

@media (max-width: 768px) {
	.site-main:not(:has(.page-hero)):not(:has(.hero)) { padding-top: 110px; }
}

/* FAQ：コアの「詳細（details）」ブロックを元の .faq-q / .faq-a に合わせる */
.faq-item > summary {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 22px 0;
	cursor: pointer;
	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: var(--green-dark);
	line-height: 1.7;
	list-style: none;
	text-align: left;
	transition: color .2s ease;
}
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary::before {
	content: "Q.";
	font-family: 'Cormorant Garamond', serif;
	font-weight: 600;
	font-size: 1.15rem;
	color: var(--gold);
	margin-right: 16px;
	flex-shrink: 0;
}
.faq-item > summary::after {
	content: "+";
	font-family: 'Cormorant Garamond', serif;
	font-size: 1.4rem;
	font-weight: 300;
	color: var(--green);
	margin-left: auto;
	padding-left: 20px;
	flex-shrink: 0;
	transition: transform .3s ease;
}
.faq-item[open] > summary::after { content: "−"; }
.faq-item > summary:hover { color: var(--green); }
.faq-item > :not(summary) {
	padding: 0 0 24px 36px;
	color: rgba(26, 42, 30, 0.70);
	font-size: 0.90rem;
	line-height: 1.9;
	letter-spacing: 0.04em;
}

/* 検索ブロック */
.site-search { max-width: 480px; margin-top: 24px; }
.site-search .wp-block-search__input {
	padding: 14px 16px;
	border: 1px solid rgba(26, 92, 46, 0.12);
	background: rgba(255, 255, 255, 0.85);
	border-radius: 4px;
	font-family: inherit;
	font-size: 0.95rem;
	color: var(--text);
}
.site-search .wp-block-search__button {
	background: var(--green);
	color: #fff;
	border: 1px solid var(--green);
	padding: 14px 24px;
	letter-spacing: 0.2em;
	font-size: 0.75rem;
	border-radius: 2px;
	cursor: pointer;
	transition: background .3s ease;
}
.site-search .wp-block-search__button:hover { background: var(--green-dark); }

/* --------------------------------------------------------------------------
   3. 投稿 / アーカイブ（静的HTMLには無かったページ）
   -------------------------------------------------------------------------- */
.post-list { margin-top: 10px; }

.post-card {
	padding: 30px 0;
	border-bottom: 1px solid rgba(26, 92, 46, 0.10);
}
.post-card:first-child { border-top: 1px solid rgba(26, 92, 46, 0.10); }

.post-card__date {
	font-family: 'Cormorant Garamond', serif;
	letter-spacing: 0.22em;
	font-size: 0.8rem;
	color: var(--gold);
	font-weight: 600;
}
.post-card__title { margin: 8px 0 10px; }
.post-card__title a {
	font-size: 1.25rem;
	color: var(--green-dark);
	text-decoration: none;
	line-height: 1.6;
	transition: color .2s ease;
}
.post-card__title a:hover { color: var(--green); }
.post-card__excerpt {
	color: rgba(26, 42, 30, 0.70);
	font-size: 0.92rem;
	line-height: 1.9;
}
.post-card__excerpt .wp-block-post-excerpt__more-link {
	display: inline-block;
	margin-top: 10px;
	font-family: 'Cormorant Garamond', serif;
	letter-spacing: 0.22em;
	font-size: 0.78rem;
	color: var(--green);
	text-decoration: none;
}

.post-pagination {
	margin-top: 50px;
	font-size: 0.85rem;
	letter-spacing: 0.1em;
}
.post-pagination a { color: var(--green); text-decoration: none; }
.post-pagination a:hover { color: var(--gold); }

/* 投稿詳細 */
.page-hero .single-title {
	font-size: 2.2rem;
	line-height: 1.6;
	color: var(--green-dark);
	margin-top: 10px;
}
@media (max-width: 768px) {
	.page-hero .single-title { font-size: 1.5rem; }
}

.single-thumb { margin-bottom: 40px; }
.single-thumb img { width: 100%; height: auto; border-radius: 2px; box-shadow: var(--shadow-card); }

.post-body { color: rgba(26, 42, 30, 0.82); }
.post-body > * + * { margin-top: 1.6em; }
.post-body h2 {
	font-size: 1.6rem;
	color: var(--green-dark);
	padding-bottom: 10px;
	border-bottom: 1px solid rgba(26, 92, 46, 0.12);
	margin-top: 2.4em;
}
.post-body h3 { font-size: 1.25rem; color: var(--green-dark); margin-top: 2em; }
.post-body h4 { font-size: 1rem; color: var(--green-dark); margin-top: 1.8em; }
.post-body ul,
.post-body ol { padding-left: 1.4em; }
.post-body ul { list-style: disc; }
.post-body ol { list-style: decimal; }
.post-body li + li { margin-top: 8px; }
.post-body a { color: var(--green); }
.post-body img { max-width: 100%; height: auto; border-radius: 2px; }
.post-body blockquote {
	border-left: 3px solid var(--gold);
	padding: 12px 0 12px 20px;
	color: rgba(26, 42, 30, 0.70);
}
.post-body table { width: 100%; border-collapse: collapse; }
.post-body th,
.post-body td { border: 1px solid rgba(26, 92, 46, 0.12); padding: 10px 14px; }

.post-nav {
	margin-top: 60px;
	padding-top: 24px;
	border-top: 1px solid rgba(26, 92, 46, 0.10);
	font-size: 0.85rem;
	letter-spacing: 0.08em;
}
.post-nav a { color: var(--green); text-decoration: none; }
.post-nav a:hover { color: var(--gold); }

.post-comments { margin-top: 60px; }
.post-comments .wp-block-comments-title { font-size: 1.2rem; color: var(--green-dark); margin-bottom: 20px; }

/* --------------------------------------------------------------------------
   4. Contact Form 7（site.css の .wpcf7 系ルールへの追加分）
   -------------------------------------------------------------------------- */
/* フォーム全体を元デザインの .cf7-ready-form と同じグリッドにする */
.wpcf7 form.wpcf7-form { display: grid; gap: 22px; }

/* CF7 は各行を <p> で包むため、余分な余白を消す */
.wpcf7 form.wpcf7-form p { margin: 0; }
.wpcf7 .wpcf7-form-control-wrap { display: block; }

.wpcf7 .form-group label {
	display: block;
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	color: var(--text);
	font-weight: 500;
	margin-bottom: 8px;
}

.wpcf7 textarea { resize: vertical; min-height: 160px; }
.form-privacy .muted { font-size: 0.82rem; }
.wpcf7 .wpcf7-list-item { margin-left: 0; margin-right: 18px; }

/* 送信ボタンは幅100%にしない（.wpcf7 input の指定を打ち消す） */
.wpcf7 input.wpcf7-submit { width: auto; }

/* 送信中スピナーはボタンの横に */
.wpcf7 .wpcf7-spinner { vertical-align: middle; }

/* 未送信時の応答エリアは領域を取らない */
.wpcf7 form:not(.sent):not(.failed):not(.invalid):not(.unaccepted):not(.payment-required) .wpcf7-response-output {
	display: none;
}

/* 送信結果・エラーメッセージ（CF7本体のCSSより詳細度を上げる） */
.wpcf7 form .wpcf7-response-output {
	margin: 20px 0 0;
	padding: 16px 20px;
	border: 1px solid var(--gold);
	border-radius: 4px;
	font-size: 0.92rem;
	line-height: 1.7;
	background: rgba(245, 236, 211, 0.25);
	color: var(--text);
}
.wpcf7 form.sent .wpcf7-response-output {
	border-color: var(--green);
	background: rgba(26, 92, 46, 0.06);
	color: var(--green-dark);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output {
	border-color: #c0392b;
	background: rgba(192, 57, 43, 0.05);
	color: #a5311f;
}

/* エラーになった項目を分かりやすく */
.wpcf7 .form-group :is(input, select, textarea).wpcf7-not-valid {
	border-color: #c0392b;
	background: rgba(192, 57, 43, 0.03);
}
.wpcf7 form .wpcf7-not-valid-tip {
	color: #c0392b;
	font-size: 0.82rem;
	margin-top: 6px;
}
