/* ============================================================================
   FFF Custom Footer v2
   ・三角形ピークの境界（bāitans 参照）
   ・中央の引用ブロック（STRUCTURE 参照）
   ・細い金線装飾
   ・5 カラム + FOLLOW US + コピーライト
   ============================================================================ */

/* Kadence デフォルトフッターを非表示 */
#colophon.site-footer .site-footer-wrap,
#colophon.site-footer .site-footer-row {
	display: none !important;
}

/* ----------------------------------------------------------------------------
   フッター本体
   ---------------------------------------------------------------------------- */

.fff-footer {
	position: relative;
	background-color: #0E0E0E;
	color: rgba(255, 254, 248, 0.78);
	padding: 0;
	margin-top: 4rem;
	z-index: 70;
	font-family: var(--wp--preset--font-family--ja, "Noto Sans JP", system-ui, sans-serif);
	overflow: hidden;
}

/* 上端の細い金線（フッターの上の境界） */
.fff-footer::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(to right, transparent 0, rgba(184, 148, 95, 0.6) 5%, rgba(184, 148, 95, 0.6) 95%, transparent 100%);
	z-index: 3;
}

/* フッター内部の装飾線は .fff-footer__inner で個別にクリップ */
.fff-footer__inner {
	overflow: hidden;
}

/* ----------------------------------------------------------------------------
   三角形ピークの境界（上端）
   ---------------------------------------------------------------------------- */

.fff-footer__peaks {
	position: absolute;
	top: -1px;
	left: 0;
	width: 100%;
	height: 20px;
	display: block;
	pointer-events: none;
}

.fff-footer__peaks .fff-peak-fill {
	fill: #1a1a1a;
}

.fff-footer__peaks .fff-peak-line {
	fill: none;
	stroke: #B8945F;
	stroke-width: 1.3;
	stroke-linejoin: round;
}

.fff-footer__peaks .fff-peak-line--white {
	stroke: rgba(255, 254, 248, 0.55);
	stroke-width: 0.8;
}

.fff-footer__peaks .fff-peak-line--thin {
	stroke-width: 0.7;
	opacity: 0.5;
}

.fff-footer__peaks .fff-peak-dot {
	fill: #B8945F;
	stroke: none;
}

/* ----------------------------------------------------------------------------
   インナーコンテナ
   ---------------------------------------------------------------------------- */

.fff-footer__inner {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	padding: 5rem 2.5rem 2rem;
	z-index: 2;
}

/* ----------------------------------------------------------------------------
   背景の細い金線装飾（SVG）
   ---------------------------------------------------------------------------- */

.fff-footer__lines {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	opacity: 0.55;
	z-index: 1;
}

.fff-footer__lines path,
.fff-footer__lines polygon {
	stroke: #B8945F;
	stroke-width: 1.2;
	fill: none;
}

.fff-footer__lines path.thin,
.fff-footer__lines polygon.thin {
	stroke-width: 0.7;
	opacity: 0.55;
}

.fff-footer__lines circle {
	stroke: #B8945F;
	stroke-width: 1.2;
	fill: none;
}

.fff-footer__lines circle.fill {
	fill: #B8945F;
	stroke: none;
}

/* ----------------------------------------------------------------------------
   ブランド列に八角形ロゴマーク
   ---------------------------------------------------------------------------- */

.fff-footer__mark {
	width: 56px;
	height: 56px;
	margin-bottom: 0.5rem;
	color: #B8945F;
}

.fff-footer__mark svg {
	width: 100%;
	height: 100%;
	display: block;
}

.fff-footer__mark path,
.fff-footer__mark polygon {
	stroke: currentColor;
	stroke-width: 1;
	fill: none;
}

/* ----------------------------------------------------------------------------
   5 カラム
   ---------------------------------------------------------------------------- */

.fff-footer__columns {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 2rem;
	margin-bottom: 2rem;
	position: relative;
	padding-top: 3rem;
}

/* ブランド列を上段に独立配置（全幅・中央揃え） */
.fff-footer__col--brand {
	grid-column: 1 / -1;
	text-align: center;
	align-items: center;
	margin-bottom: 1.5rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid rgba(184, 148, 95, 0.3);
}

.fff-footer__col--brand .fff-footer__logo,
.fff-footer__col--brand .fff-footer__tagline {
	text-align: center;
}

.fff-footer__col--brand .fff-footer__tagline {
	max-width: 540px;
	margin-left: auto;
	margin-right: auto;
}

/* 上に伸びてたカラム間の水平線は廃止（brand のボーダーが代わり） */
.fff-footer__columns::before {
	display: none;
}

.fff-footer__col {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

/* ブランド列：見出しドットを表示しない */
.fff-footer__col--brand {
	gap: 1.25rem;
}

.fff-footer__col--brand .fff-footer__heading::before,
.fff-footer__col--brand .fff-footer__heading::after {
	display: none;
}

.fff-footer__logo {
	font-family: var(--wp--preset--font-family--en, "Inter", sans-serif);
	font-size: 1.15rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: #ffffff;
	line-height: 1.3;
}

.fff-footer__logo-eyebrow {
	display: block;
	font-size: 0.65rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #B8945F;
	margin-bottom: 0.5rem;
	font-weight: 600;
}

.fff-footer__tagline {
	font-size: 0.78rem;
	line-height: 1.85;
	color: rgba(255, 254, 248, 0.62);
	letter-spacing: 0.05em;
}

/* ----------------------------------------------------------------------------
   カラム見出し
   ---------------------------------------------------------------------------- */

.fff-footer__heading {
	position: relative;
	font-family: var(--wp--preset--font-family--en, "Inter", sans-serif);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #B8945F;
	margin: 0 0 1.25rem;
	padding-top: 0.5rem;
}

/* 各カラム見出しの上に金色ドット（カラムをつなぐ水平線と接続） */
.fff-footer__heading::before {
	content: "";
	position: absolute;
	top: -3rem;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: #B8945F;
}

/* ドットからカラム見出しに伸びる縦線 */
.fff-footer__heading::after {
	content: "";
	position: absolute;
	top: -2.5rem;
	left: 4px;
	width: 1px;
	height: 2rem;
	background-color: rgba(184, 148, 95, 0.4);
}

/* ----------------------------------------------------------------------------
   リンクリスト（●ドット付き）
   ---------------------------------------------------------------------------- */

.fff-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
}

.fff-footer__list a {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	color: rgba(255, 254, 248, 0.74);
	font-size: 0.85rem;
	text-decoration: none;
	line-height: 1.5;
	transition: color 0.3s ease;
	font-family: var(--wp--preset--font-family--ja, system-ui, sans-serif);
}

.fff-footer__list a::before {
	content: "";
	width: 4px;
	height: 4px;
	background-color: #B8945F;
	border-radius: 50%;
	flex-shrink: 0;
	transition: transform 0.3s ease;
}

.fff-footer__list a:hover {
	color: #ffffff;
}

.fff-footer__list a:hover::before {
	transform: scale(1.5);
}

/* ----------------------------------------------------------------------------
   FOLLOW US セクション
   ---------------------------------------------------------------------------- */

.fff-footer__bottom {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: end;
	gap: 3rem;
	padding-top: 3rem;
	border-top: 1px solid rgba(184, 148, 95, 0.18);
}

.fff-footer__follow-label {
	font-family: var(--wp--preset--font-family--en, "Inter", sans-serif);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #B8945F;
	margin: 0 0 1rem;
}

.fff-footer__sns {
	display: flex;
	gap: 1.25rem;
}

.fff-footer__sns a {
	color: rgba(255, 254, 248, 0.72);
	font-size: 0.75rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--en, "Inter", sans-serif);
	transition: color 0.3s ease;
	padding: 0.35rem 0.85rem;
	border: 1px solid rgba(184, 148, 95, 0.32);
}

.fff-footer__sns a:hover {
	color: #1a1a1a;
	background-color: #B8945F;
	border-color: #B8945F;
}

/* ----------------------------------------------------------------------------
   コピーライト + 法務リンク
   ---------------------------------------------------------------------------- */

.fff-footer__meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2rem;
	padding: 1.5rem 0 0.5rem;
	margin-top: 2.5rem;
	border-top: 1px solid rgba(184, 148, 95, 0.12);
}

.fff-footer__copyright {
	font-size: 0.7rem;
	letter-spacing: 0.12em;
	color: rgba(255, 254, 248, 0.4);
	font-family: var(--wp--preset--font-family--en, "Inter", sans-serif);
	margin: 0;
}

.fff-footer__legal {
	display: flex;
	gap: 1.5rem;
	font-size: 0.7rem;
	letter-spacing: 0.12em;
	color: rgba(255, 254, 248, 0.4);
}

.fff-footer__legal a {
	color: rgba(255, 254, 248, 0.62);
	text-decoration: none;
	transition: color 0.3s ease;
}

.fff-footer__legal a:hover {
	color: #B8945F;
}

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

/* ============================================================================
   タブレット (768〜1023px) — iPad
   ・ブランド列はフル幅（上に独立）
   ・About / Programs / Insights / Contact は 4 カラム横並び
   ・カラムを繋ぐ横線は短めに引き直す
   ・右下装飾の透明度を下げる
   ============================================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
	.fff-footer__inner {
		padding: 4rem 2rem 2rem;
	}
	.fff-footer__columns {
		grid-template-columns: repeat(3, 1fr);
		gap: 2rem 1.5rem;
		padding-top: 2rem;
	}
	.fff-footer__col--brand {
		grid-column: 1 / -1; /* 全幅 */
		margin-bottom: 1rem;
	}
	/* iPad 時の横線は 4 カラムの上に引き直す */
	.fff-footer__columns::before {
		left: 0;
		right: 0;
	}
	/* 各カラム見出しのドット装飾は維持（4 カラムだから機能する） */
	.fff-footer__heading::before {
		top: -1.5rem;
	}
	.fff-footer__heading::after {
		top: -1rem;
		height: 1rem;
	}
	/* ブランド列の上の横線は非表示（フル幅で関係ない） */
	.fff-footer__col--brand .fff-footer__heading::before,
	.fff-footer__col--brand .fff-footer__heading::after {
		display: none;
	}
	/* 右下装飾を控えめに */
	.fff-footer__lines {
		opacity: 0.35;
	}
	.fff-footer__bottom {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
}

/* スマホ専用: アコーディオン項目と同じ並びの単独リンク（Privacy Policy / Legal）
   ・PC/iPad では下端の .fff-footer__legal を使うので、ここでは非表示
   ・スマホではアコーディオンと同じ階層で見出し並び
*/
.fff-footer__col--single-link {
	display: none;
}

/* スマホ専用: コピーライト直前のブランドブロック
   ・PC/iPad では columns 内のブランド列を使うので、ここでは非表示
*/
.fff-footer__brand-mobile {
	display: none;
}

/* ============================================================================
   アコーディオン（<details> 要素）共通スタイル
   ・標準マーカー（▶）を非表示
   ・PC/iPad では <summary> をただの見出しに見せる
   ============================================================================ */
.fff-footer__col--collapsible > summary {
	list-style: none;
}
.fff-footer__col--collapsible > summary::-webkit-details-marker {
	display: none;
}
.fff-footer__col--collapsible > summary::marker {
	display: none;
	content: "";
}
.fff-footer__col--collapsible[open] > summary {
	margin-bottom: 1.25rem;
}

/* ============================================================================
   スマホ (640px 以下)
   ・2 カラム → 1 カラム
   ・装飾ドット・縦線・右下カーブ全部非表示（窮屈にならないように）
   ・見出しの左に小さなドットだけ残す（アクセント）
   ・コピーライト・法務リンクを縦並びに
   ============================================================================ */
@media (max-width: 640px) {
	.fff-footer {
		margin-top: 2rem;
	}
	.fff-footer__inner {
		padding: 2rem 1.25rem 1rem;
	}
	.fff-footer__columns {
		grid-template-columns: 1fr;
		gap: 0;
		padding-top: 0;
		margin-bottom: 1rem;
	}
	.fff-footer__col {
		gap: 0;
	}
	/* スマホでは columns 内のブランド列を非表示（コピーライト前に移動） */
	.fff-footer__col--brand {
		display: none;
	}
	/* スマホ専用: Privacy Policy / Legal を summary と同じ見た目で表示 */
	.fff-footer__col--single-link {
		display: block;
		position: relative;
		padding: 0.6rem 1.75rem 0.6rem 1rem;
		color: #B8945F;
		font-family: var(--wp--preset--font-family--en, "Inter", sans-serif);
		font-size: 0.7rem;
		font-weight: 600;
		letter-spacing: 0.22em;
		text-transform: uppercase;
		text-decoration: none;
		border-bottom: 1px solid rgba(184, 148, 95, 0.15);
		transition: color 0.2s ease;
	}
	/* 左端ドット（summary と同じ装飾） */
	.fff-footer__col--single-link::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #B8945F;
		transform: translateY(-50%);
	}
	.fff-footer__col--single-link:hover,
	.fff-footer__col--single-link:focus-visible {
		color: #ffffff;
	}

	/* スマホでは上端の細い線（フッター全体の top 線）を削除 */
	.fff-footer::before {
		display: none;
	}
	/* FOLLOW US セクションの上の border-top を削除 */
	.fff-footer__bottom {
		border-top: none;
		padding-top: 0.5rem;
	}

	/* スマホ専用: コピーライト直前のブランドブロックを表示 */
	.fff-footer__brand-mobile {
		display: block;
		margin: 1.5rem 0 1rem;
		padding-top: 1.5rem;
		border-top: 1px solid rgba(184, 148, 95, 0.18);
	}
	.fff-footer__brand-mobile .fff-footer__logo {
		font-size: 1rem;
		margin-bottom: 0.4rem;
		color: #ffffff;
	}
	.fff-footer__brand-mobile .fff-footer__tagline {
		font-size: 0.72rem;
		line-height: 1.65;
		color: rgba(255, 254, 248, 0.62);
		margin: 0;
	}
	/* 下端の .fff-footer__legal は重複するので非表示 */
	.fff-footer__legal {
		display: none;
	}
	/* 縦並びになったらカラム上ドットは消す */
	.fff-footer__heading::after {
		display: none;
	}
	/* 代わりに見出しの左に小さなドット（アクセント残し） */
	.fff-footer__heading {
		padding-left: 1rem;
	}
	.fff-footer__heading::before {
		top: 50%;
		left: 0;
		width: 5px;
		height: 5px;
		transform: translateY(-50%);
	}
	/* ブランド列の見出しは元のまま（特別扱い） */
	.fff-footer__col--brand .fff-footer__heading {
		padding-left: 0;
	}
	/* アコーディオン: ぺっちゃんこに詰める */
	.fff-footer__col--collapsible {
		border-bottom: 1px solid rgba(184, 148, 95, 0.15);
	}
	.fff-footer__col--collapsible > summary {
		cursor: pointer;
		padding: 0.6rem 1.75rem 0.6rem 0.75rem;
		position: relative;
		user-select: none;
		margin-bottom: 0;
		transition: color 0.2s ease;
		font-size: 0.7rem;
	}
	.fff-footer__col--collapsible > summary::after {
		content: "+";
		position: absolute;
		right: 0.25rem;
		top: 50%;
		transform: translateY(-50%);
		font-size: 1.1rem;
		color: #B8945F;
		font-weight: 300;
		line-height: 1;
		transition: transform 0.3s ease;
	}
	.fff-footer__col--collapsible[open] > summary::after {
		content: "−";
	}
	.fff-footer__col--collapsible[open] > summary {
		margin-bottom: 0;
		color: #ffffff;
	}
	/* アコーディオン展開時のリストの padding（ぎゅっと詰める） */
	.fff-footer__col--collapsible[open] > .fff-footer__list {
		padding: 0.25rem 0 0.6rem 0.75rem;
		gap: 0.35rem;
	}
	.fff-footer__col--collapsible[open] > .fff-footer__list a {
		font-size: 0.78rem;
	}
	/* 右下装飾は非表示 */
	.fff-footer__lines {
		display: none;
	}
	/* ロゴサイズ・タグライン縮小 */
	.fff-footer__logo {
		font-size: 0.95rem;
		margin-bottom: 0.25rem;
	}
	.fff-footer__tagline {
		font-size: 0.72rem;
		line-height: 1.6;
		margin: 0.25rem 0;
	}
	.fff-footer__mark {
		width: 40px;
		height: 40px;
		margin-bottom: 0.25rem;
	}
	/* リンクのフォント */
	.fff-footer__list a {
		font-size: 0.8rem;
	}
	/* FOLLOW US セクションも縮める */
	.fff-footer__bottom {
		padding-top: 1.25rem;
		gap: 0.75rem;
	}
	.fff-footer__follow-label {
		font-size: 0.65rem;
		margin: 0 0 0.5rem;
	}
	/* SNS リンクを縦並びでも横折り返し */
	.fff-footer__sns {
		flex-wrap: wrap;
		gap: 0.4rem;
	}
	.fff-footer__sns a {
		font-size: 0.62rem;
		padding: 0.25rem 0.55rem;
		letter-spacing: 0.12em;
	}
	/* コピーライト・法務 縦並び */
	.fff-footer__meta {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
		margin-top: 1rem;
		padding-top: 0.75rem;
	}
	.fff-footer__legal {
		gap: 1rem;
		flex-wrap: wrap;
	}
	.fff-footer__copyright,
	.fff-footer__legal {
		font-size: 0.62rem;
	}
}
