/*
Theme Name: Koharu Child
Theme URI: https://tachibana-koharu.jp/
Author: lumito AI Creative Studio
Author URI: https://lumito.jp/
Description: イラストレーター「立花小春」のポートフォリオサイト専用の子テーマ。和モダン（生成り×墨×金泥）を基調に、装画サンプルと美人画ギャラリーを中心とした構成をカスタムブロックパターンと専用CSSで実装します。Twenty Twenty-Five を親テーマとします。
Template: twentytwentyfive
Version: 0.2.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: koharu-child
*/

/* ==========================================================
   立花小春 — 和モダン
   生成り #F7F2E9 ／ 墨 #2B2B28 ／ 金泥 #A98B54 ／ 朱 #B5443C（一点のみ）
   装飾は細い線と余白だけ。絵が主役。
   ========================================================== */

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	background: #f7f2e9;
	color: #2b2b28;
}

::selection {
	background: #a98b54;
	color: #f7f2e9;
}

/* 固定ヘッダー分のスクロール位置調整（ページ内リンク用） */
html {
	scroll-padding-top: 96px;
}

/* ログイン中はWordPressの管理バーと重ならないようにする */
body.admin-bar .koharu-header {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .koharu-header {
		top: 46px;
	}

	html {
		scroll-padding-top: 84px;
	}
}

/* ==========================================================
   共通
   ========================================================== */

.koharu-front {
	font-family: 'Shippori Mincho', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
	color: #2b2b28;
	background: #f7f2e9;
}

.koharu-front *,
.koharu-front *::before,
.koharu-front *::after {
	box-sizing: border-box;
}

.koharu-front a {
	color: inherit;
	text-decoration: none;
}

.koharu-front img {
	display: block;
	max-width: 100%;
}

/* セクションの骨格 */
.koharu-section {
	max-width: 1240px;
	margin: 0 auto;
	padding: 110px 48px;
}

/* セクション見出し（英字ラベル＋和文） */
.koharu-label {
	margin-bottom: 52px;
}

.koharu-label__en {
	display: block;
	font-family: 'Cormorant Garamond', 'Times New Roman', serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.42em;
	color: #a98b54;
	margin-bottom: 14px;
}

.koharu-label__jp {
	display: inline-block;
	font-size: 26px;
	font-weight: 500;
	letter-spacing: 0.22em;
	line-height: 1.5;
}

a.koharu-label__jp {
	border-bottom: 1px solid rgba(169, 139, 84, 0.4);
	padding-bottom: 6px;
	transition: color 0.3s ease, border-color 0.3s ease;
}

a.koharu-label__jp:hover {
	color: #b5443c;
	border-color: rgba(181, 68, 60, 0.5);
}

.koharu-rule {
	display: block;
	width: 64px;
	height: 1px;
	background: rgba(169, 139, 84, 0.55);
	border: 0;
}

/* ==========================================================
   ヘッダー（固定）
   ========================================================== */

.koharu-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 18px 48px;
	background: rgba(247, 242, 233, 0.94);
	border-bottom: 1px solid rgba(169, 139, 84, 0.28);
	font-family: 'Shippori Mincho', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
}

.koharu-logo {
	display: flex;
	align-items: baseline;
	gap: 14px;
	line-height: 1;
}

.koharu-logo__name {
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0.34em;
	color: #2b2b28;
}

.koharu-logo__en {
	font-family: 'Cormorant Garamond', 'Times New Roman', serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.34em;
	color: #a98b54;
}

.koharu-nav {
	display: flex;
	align-items: center;
	gap: 38px;
}

.koharu-nav a {
	font-size: 14px;
	letter-spacing: 0.24em;
	color: #2b2b28;
	padding: 4px 0;
	border-bottom: 1px solid transparent;
	transition: color 0.3s ease, border-color 0.3s ease;
}

.koharu-nav a:hover {
	color: #b5443c;
	border-bottom-color: rgba(181, 68, 60, 0.5);
}

/* ==========================================================
   ヒーロー
   ========================================================== */

.koharu-hero {
	position: relative;
	min-height: 100vh;
	min-height: 100svh;
	overflow: hidden;
	background: #f7f2e9;
}

.koharu-hero__media {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 62%;
	z-index: 1;
	overflow: hidden;
}

.koharu-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

/* 画像下端を生成りへ静かに溶かす */
.koharu-hero__media::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 18%;
	background: linear-gradient(to bottom, rgba(247, 242, 233, 0), rgba(247, 242, 233, 0.55));
	pointer-events: none;
}

.koharu-hero__text {
	position: relative;
	z-index: 2;
	width: 38%;
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 132px 24px 56px 56px;
}

.koharu-hero__names {
	display: flex;
	gap: 26px;
	align-items: flex-start;
}

.koharu-hero__name {
	writing-mode: vertical-rl;
	font-size: clamp(58px, 7.2vw, 96px);
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.25;
	color: #2b2b28;
	margin: 0;
}

.koharu-hero__kana {
	writing-mode: vertical-rl;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.52em;
	color: #a98b54;
	margin: 10px 0 0;
}

.koharu-hero__copy {
	margin-top: 64px;
}

.koharu-hero__copy .koharu-rule {
	margin-bottom: 26px;
}

.koharu-hero__title {
	font-size: clamp(19px, 1.7vw, 24px);
	font-weight: 500;
	letter-spacing: 0.14em;
	line-height: 2;
	margin: 0 0 18px;
}

.koharu-hero__en {
	font-family: 'Cormorant Garamond', 'Times New Roman', serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.38em;
	color: #a98b54;
	margin: 0;
}

/* ==========================================================
   装画サンプル
   ========================================================== */

.koharu-covers__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 48px;
}

.koharu-cover {
	margin: 0;
}

.koharu-cover img {
	width: 100%;
	height: auto;
	box-shadow: 0 22px 44px rgba(43, 43, 40, 0.16);
}

.koharu-cover figcaption {
	margin-top: 22px;
	font-size: 16px;
	letter-spacing: 0.1em;
	line-height: 1.8;
	text-align: center;
}

.koharu-covers__note {
	margin: 44px 0 0;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
	font-size: 12px;
	font-weight: 300;
	letter-spacing: 0.12em;
	color: rgba(43, 43, 40, 0.62);
	text-align: center;
}

/* ==========================================================
   得意分野
   ========================================================== */

.koharu-fields {
	background: #efe7d8;
}

.koharu-fields__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 44px;
}

.koharu-field h3 {
	font-size: 19px;
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.6;
	margin: 0 0 16px;
}

.koharu-field .koharu-rule {
	width: 36px;
	margin-bottom: 18px;
}

.koharu-field p {
	font-size: 14.5px;
	line-height: 2.1;
	margin: 0;
	color: rgba(43, 43, 40, 0.88);
}

/* ==========================================================
   About 抜粋
   ========================================================== */

.koharu-about__body {
	max-width: 720px;
}

.koharu-about__text {
	font-size: 16.5px;
	line-height: 2.3;
	letter-spacing: 0.04em;
	margin: 0 0 36px;
}

.koharu-about__more {
	display: inline-block;
	font-size: 14.5px;
	letter-spacing: 0.2em;
	padding-bottom: 6px;
	border-bottom: 1px solid rgba(169, 139, 84, 0.55);
	transition: color 0.3s ease, border-color 0.3s ease;
}

.koharu-about__more:hover {
	color: #b5443c;
	border-bottom-color: rgba(181, 68, 60, 0.5);
}

/* ==========================================================
   ご依頼 CTA
   ========================================================== */

.koharu-cta {
	border-top: 1px solid rgba(169, 139, 84, 0.4);
	text-align: center;
}

.koharu-cta__title {
	font-size: clamp(21px, 2.4vw, 28px);
	font-weight: 500;
	letter-spacing: 0.2em;
	line-height: 1.8;
	margin: 0 0 20px;
}

.koharu-cta__text {
	font-size: 15px;
	line-height: 2.1;
	color: rgba(43, 43, 40, 0.85);
	margin: 0 auto 42px;
	max-width: 560px;
}

.koharu-cta__btn {
	display: inline-block;
	font-size: 15px;
	letter-spacing: 0.26em;
	padding: 16px 52px 16px calc(52px + 0.26em);
	border: 1px solid #2b2b28;
	color: #2b2b28;
	transition: color 0.3s ease, border-color 0.3s ease, background 0.3s ease;
}

.koharu-cta__btn:hover {
	color: #b5443c;
	border-color: #b5443c;
}

/* ==========================================================
   フッター
   ========================================================== */

.koharu-footer {
	border-top: 1px solid rgba(169, 139, 84, 0.4);
	padding: 54px 48px 46px;
	text-align: center;
}

.koharu-footer__brand {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin-bottom: 16px;
}

/* 落款風の小さな朱の印（サイトで唯一の朱） */
.koharu-seal {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 27px;
	height: 27px;
	background: #b5443c;
	color: #f7f2e9;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	border-radius: 3px;
}

.koharu-footer__name {
	font-size: 19px;
	font-weight: 600;
	letter-spacing: 0.34em;
}

.koharu-footer__en {
	font-family: 'Cormorant Garamond', 'Times New Roman', serif;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.32em;
	color: #a98b54;
	margin: 0 0 22px;
}

.koharu-footer__copy {
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
	font-size: 11px;
	font-weight: 300;
	letter-spacing: 0.14em;
	color: rgba(43, 43, 40, 0.55);
	margin: 0;
}

/* ==========================================================
   汎用ページ（index / page テンプレート用）
   ========================================================== */

.koharu-page {
	font-family: 'Shippori Mincho', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
	max-width: 880px;
	margin: 0 auto;
	padding: 150px 32px 110px;
}

.koharu-page .wp-block-post-title {
	font-size: clamp(26px, 4vw, 36px);
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1.6;
	margin-bottom: 56px;
}

.koharu-page .wp-block-post-content {
	font-size: 16px;
	line-height: 2.2;
}

/* ==========================================================
   レスポンシブ
   ========================================================== */

@media (max-width: 900px) {
	.koharu-header {
		padding: 14px 24px;
	}

	.koharu-logo__name {
		font-size: 19px;
	}

	.koharu-nav {
		gap: 22px;
	}

	.koharu-nav a {
		font-size: 13px;
		letter-spacing: 0.16em;
	}

	.koharu-section {
		padding: 84px 28px;
	}

	/* ヒーロー：画像が上、文章が下 */
	.koharu-hero {
		min-height: 0;
		display: flex;
		flex-direction: column;
	}

	.koharu-hero__media {
		position: relative;
		width: 100%;
		height: 60vh;
		height: 60svh;
		order: -1;
	}

	.koharu-hero__text {
		width: 100%;
		min-height: 0;
		padding: 48px 28px 64px;
	}

	.koharu-hero__name {
		font-size: 54px;
	}

	.koharu-hero__copy {
		margin-top: 48px;
	}

	.koharu-covers__grid {
		gap: 30px;
	}

	.koharu-fields__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 36px 30px;
	}
}

@media (max-width: 640px) {
	.koharu-logo__en {
		display: none;
	}

	.koharu-nav {
		gap: 16px;
	}

	.koharu-nav a {
		font-size: 12px;
		letter-spacing: 0.1em;
	}

	.koharu-section {
		padding: 72px 22px;
	}

	.koharu-label {
		margin-bottom: 40px;
	}

	.koharu-label__jp {
		font-size: 22px;
	}

	.koharu-hero__media {
		height: 56vh;
		height: 56svh;
	}

	.koharu-hero__text {
		padding: 40px 22px 56px;
	}

	.koharu-hero__names {
		gap: 18px;
	}

	.koharu-hero__name {
		font-size: 46px;
	}

	.koharu-hero__kana {
		font-size: 11px;
	}

	.koharu-covers__grid {
		grid-template-columns: 1fr;
		gap: 44px;
		max-width: 340px;
		margin: 0 auto;
	}

	.koharu-fields__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.koharu-about__text {
		font-size: 15.5px;
		line-height: 2.2;
	}

	.koharu-footer {
		padding: 46px 22px 40px;
	}

	.koharu-page {
		padding: 120px 22px 90px;
	}
}

/* ==========================================================
   Phase 2 — 下層ページ共通（装画サンプル／About／ご依頼）
   ========================================================== */

/* ページ先頭（固定ヘッダー分の余白を確保） */
.koharu-pagehead {
	padding-top: 168px;
	padding-bottom: 24px;
}

.koharu-pagetitle__jp {
	font-size: clamp(30px, 4vw, 40px);
	font-weight: 600;
	letter-spacing: 0.18em;
	line-height: 1.5;
	margin: 0 0 24px;
}

/* 導入の注記 */
.koharu-note {
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
	font-size: 12.5px;
	font-weight: 300;
	letter-spacing: 0.1em;
	line-height: 2;
	color: rgba(43, 43, 40, 0.62);
	margin: 36px 0 0;
}

/* 下層ページの本文セクション（見出しを積み重ねる形） */
.koharu-subpage {
	padding-top: 36px;
}

.koharu-subhead {
	font-size: 21px;
	font-weight: 600;
	letter-spacing: 0.2em;
	line-height: 1.6;
	margin: 76px 0 30px;
	padding-bottom: 14px;
	border-bottom: 1px solid rgba(169, 139, 84, 0.4);
}

.koharu-subpage > .koharu-subhead:first-child {
	margin-top: 0;
}

/* 散文（About・ご依頼の本文） */
.koharu-prose {
	max-width: 44em;
}

.koharu-prose p {
	font-size: 16.5px;
	line-height: 2.1;
	letter-spacing: 0.04em;
	margin: 0 0 28px;
}

.koharu-prose p:last-child {
	margin-bottom: 0;
}

/* ==========================================================
   Phase 2 — 装画サンプル（書籍セクション）
   ========================================================== */

.koharu-book {
	border-top: 1px solid rgba(169, 139, 84, 0.35);
	padding-top: 84px;
	padding-bottom: 84px;
}

.koharu-book__title {
	font-size: clamp(23px, 2.6vw, 30px);
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1.6;
	margin: 0 0 48px;
}

.koharu-book__author {
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.2em;
	color: rgba(43, 43, 40, 0.72);
	margin-left: 22px;
	white-space: nowrap;
}

/* 左に書影（見本＋装画）、右に書誌と文章 */
.koharu-book__layout {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 56px;
	align-items: start;
}

.koharu-book__figure {
	margin: 0 0 42px;
}

.koharu-book__figure:last-child {
	margin-bottom: 0;
}

.koharu-book__figure img {
	width: 100%;
	height: auto;
	box-shadow: 0 22px 44px rgba(43, 43, 40, 0.16);
}

.koharu-book__figure figcaption {
	margin-top: 16px;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
	font-size: 11.5px;
	font-weight: 300;
	letter-spacing: 0.14em;
	color: rgba(43, 43, 40, 0.58);
	text-align: center;
}

/* 書誌情報（金の細線で区切る定義リスト） */
.koharu-meta {
	margin: 0 0 44px;
}

.koharu-meta__row {
	display: flex;
	gap: 24px;
	padding: 13px 2px;
	border-bottom: 1px solid rgba(169, 139, 84, 0.35);
}

.koharu-meta__row:first-child {
	border-top: 1px solid rgba(169, 139, 84, 0.35);
}

.koharu-meta dt {
	flex: 0 0 6em;
	font-size: 13.5px;
	font-weight: 600;
	letter-spacing: 0.18em;
	color: #a98b54;
	margin: 0;
}

.koharu-meta dd {
	font-size: 15.5px;
	letter-spacing: 0.06em;
	line-height: 1.8;
	margin: 0;
}

.koharu-book__h {
	font-size: 16.5px;
	font-weight: 600;
	letter-spacing: 0.22em;
	margin: 40px 0 16px;
}

.koharu-book__text {
	font-size: 15.5px;
	line-height: 2.15;
	letter-spacing: 0.04em;
	color: rgba(43, 43, 40, 0.9);
	margin: 0;
}

/* ==========================================================
   Phase 2 — About（経歴・作家紹介文）
   ========================================================== */

.koharu-history {
	list-style: none;
	max-width: 44em;
	margin: 0;
	padding: 0;
}

.koharu-history li {
	font-size: 15.5px;
	letter-spacing: 0.05em;
	line-height: 2;
	padding: 15px 2px;
	border-bottom: 1px solid rgba(169, 139, 84, 0.3);
}

.koharu-history li:first-child {
	border-top: 1px solid rgba(169, 139, 84, 0.3);
}

.koharu-statement p {
	margin-bottom: 30px;
}

/* 作家紹介文の核の一文 */
.koharu-statement__core strong {
	font-weight: 600;
	letter-spacing: 0.05em;
}

.koharu-statement__sign {
	text-align: right;
	letter-spacing: 0.3em;
	margin-top: 44px;
}

/* ==========================================================
   Phase 2 — ご依頼（リスト・制作の流れ・お問い合わせ）
   ========================================================== */

.koharu-list {
	list-style: none;
	max-width: 44em;
	margin: 0;
	padding: 0;
}

.koharu-list li {
	font-size: 15.5px;
	letter-spacing: 0.06em;
	line-height: 2;
	padding: 13px 2px;
	border-bottom: 1px solid rgba(169, 139, 84, 0.3);
}

.koharu-list li:first-child {
	border-top: 1px solid rgba(169, 139, 84, 0.3);
}

/* 制作の流れ（番号付きステップ） */
.koharu-steps {
	list-style: none;
	max-width: 44em;
	margin: 0;
	padding: 0;
}

.koharu-step {
	display: flex;
	gap: 24px;
	align-items: flex-start;
	padding: 24px 2px;
	border-bottom: 1px solid rgba(169, 139, 84, 0.3);
}

.koharu-step:first-child {
	border-top: 1px solid rgba(169, 139, 84, 0.3);
}

.koharu-step__no {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid rgba(169, 139, 84, 0.7);
	border-radius: 50%;
	font-family: 'Cormorant Garamond', 'Times New Roman', serif;
	font-size: 17px;
	font-weight: 500;
	color: #a98b54;
	margin-top: 2px;
}

.koharu-step__title {
	font-size: 16.5px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1.7;
	margin: 4px 0 0;
}

.koharu-step__text {
	font-size: 14.5px;
	line-height: 2;
	color: rgba(43, 43, 40, 0.85);
	margin: 8px 0 0;
}

/* お問い合わせブロック */
.koharu-contact-box {
	margin-top: 84px;
	padding: 58px 40px 50px;
	border: 1px solid rgba(169, 139, 84, 0.55);
	text-align: center;
}

.koharu-contact-box__label {
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.34em;
	color: #a98b54;
	margin: 0 0 30px;
}

.koharu-mailbtn {
	display: inline-block;
	font-size: clamp(18px, 2.4vw, 25px);
	font-weight: 500;
	letter-spacing: 0.06em;
	padding: 18px 44px;
	border: 1px solid #a98b54;
	color: #2b2b28;
	transition: color 0.3s ease, border-color 0.3s ease;
}

.koharu-mailbtn:hover {
	color: #b5443c;
	border-color: #b5443c;
}

.koharu-contact-box__note {
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
	font-size: 12.5px;
	font-weight: 300;
	letter-spacing: 0.1em;
	line-height: 2;
	color: rgba(43, 43, 40, 0.62);
	margin: 30px 0 0;
}

/* 制作方法への小さな注記 */
.koharu-smallnote {
	font-size: 13px;
	line-height: 2.1;
	letter-spacing: 0.04em;
	color: rgba(43, 43, 40, 0.72);
	margin: 46px 0 0;
	max-width: 44em;
}

.koharu-smallnote a {
	border-bottom: 1px solid rgba(169, 139, 84, 0.55);
	padding-bottom: 2px;
	transition: color 0.3s ease, border-color 0.3s ease;
}

.koharu-smallnote a:hover {
	color: #b5443c;
	border-color: rgba(181, 68, 60, 0.5);
}

/* ==========================================================
   Phase 2 — レスポンシブ
   ========================================================== */

@media (max-width: 900px) {
	.koharu-pagehead {
		padding-top: 138px;
	}

	.koharu-book__layout {
		grid-template-columns: 1fr;
		gap: 48px;
	}

	.koharu-book__images {
		max-width: 560px;
	}
}

@media (max-width: 640px) {
	.koharu-pagehead {
		padding-top: 116px;
	}

	.koharu-pagetitle__jp {
		font-size: 26px;
	}

	.koharu-book {
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.koharu-book__title {
		margin-bottom: 36px;
	}

	.koharu-book__author {
		display: block;
		margin: 8px 0 0;
	}

	.koharu-meta__row {
		gap: 16px;
	}

	.koharu-meta dt {
		flex-basis: 5em;
	}

	.koharu-subhead {
		font-size: 19px;
		margin-top: 60px;
	}

	.koharu-prose p {
		font-size: 15.5px;
	}

	.koharu-step {
		gap: 16px;
		padding: 20px 2px;
	}

	.koharu-contact-box {
		padding: 42px 20px 38px;
		margin-top: 64px;
	}

	.koharu-mailbtn {
		font-size: 16.5px;
		padding: 16px 18px;
		word-break: break-all;
	}
}