/**
 * Marry Grace 洋婚詳細ページ専用CSS
 *
 * モック western-wedding-single_v1.0.html から、style.cssに移動した
 * 共通コンポーネント（.section-divider / .common-cta）を除いた、
 * 詳細ページ専用のセクションスタイル。
 *
 * デザイントークン（--color-* / --font-* / --space-*）は style.css の :root を継承
 *
 * @package Marry_Grace
 * @since 0.5.0
 */

/* ==========================================================================
   FV - C-2 オーバーラップ型
   写真の下端に被さる白カードでタイトルを表示
   ========================================================================== */
.venue-fv {
	margin-top: var(--space-md);
	padding-bottom: var(--space-2xl);
}
.venue-fv__image {
	position: relative;
	aspect-ratio: 21 / 9;
	background-color: var(--color-bg-mute);
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.venue-fv__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-muted);
	font-family: var(--font-en);
	font-size: var(--fs-sm);
	letter-spacing: var(--ls-wide);
}
.venue-fv__card-wrap {
	position: relative;
	margin-top: -4rem;
	padding: 0 var(--space-md);
	z-index: 2;
}
.venue-fv__card {
	background: var(--color-bg);
	max-width: 42rem;
	margin: 0 auto;
	padding: var(--space-xl) var(--space-2xl);
	text-align: center;
	box-shadow: 0 4px 24px rgba(58, 53, 47, 0.08);
}
.venue-fv__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-md);
	letter-spacing: var(--ls-xwide);
	text-transform: uppercase;
	color: var(--color-secondary);
	margin-bottom: var(--space-sm);
}
.venue-fv__divider {
	display: block;
	width: 2.5rem;
	height: 1px;
	background: var(--color-secondary);
	margin: var(--space-sm) auto var(--space-md);
}
.venue-fv__title {
	font-family: var(--font-jp);
	font-size: clamp(1.625rem, 3.5vw, 2.25rem);
	font-weight: 200;
	letter-spacing: 0.06em;
	line-height: 1.5;
	margin: 0 0 var(--space-sm);
	color: var(--color-text);
}
.venue-fv__subtitle {
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	margin: 0;
	letter-spacing: 0.06em;
}


/* ==========================================================================
   CONCEPT
   ========================================================================== */
.venue-concept {
	padding: var(--space-3xl) 0;
}
.venue-concept__inner {
	display: grid;
	grid-template-columns: 1fr 2fr;
	column-gap: var(--space-2xl);
	row-gap: var(--space-lg);
	align-items: start;
	max-width: var(--container-narrow);
	margin: 0 auto;
}
.venue-concept__label {
	font-family: var(--font-en);
	font-size: var(--fs-sm);
	font-weight: 400;
	letter-spacing: var(--ls-xwide);
	text-transform: uppercase;
	color: var(--color-secondary);
	position: relative;
	padding-top: 0.5em;
}
.venue-concept__label::before {
	content: "";
	display: block;
	width: 2rem;
	height: 1px;
	background: var(--color-secondary);
	margin-bottom: var(--space-md);
}
.venue-concept__content {
	display: flex;
	flex-direction: column;
	gap: var(--space-lg);
}
.venue-concept__catch {
	font-family: var(--font-jp);
	font-size: var(--fs-lg);
	font-weight: 300;
	line-height: 1.9;
	letter-spacing: 0.08em;
	color: var(--color-text);
	margin: 0;
}
.venue-concept__body {
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	font-weight: 300;
	line-height: 2.2;
	letter-spacing: 0.06em;
	color: var(--color-text-muted);
}
.venue-concept__image {
	grid-column: 1 / -1;
	margin: 0;
	overflow: hidden;
}
.venue-concept__image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}


/* ==========================================================================
   FEATURE - 3つのポイント（ジグザグ配置）
   ========================================================================== */
.venue-feature {
	padding: var(--space-3xl) 0;
}
.venue-feature__head {
	text-align: center;
	margin-bottom: var(--space-2xl);
}
.venue-feature__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-md);
	letter-spacing: var(--ls-xwide);
	color: var(--color-secondary);
	margin-bottom: var(--space-xs);
}
.venue-feature__title {
	font-family: var(--font-jp);
	font-size: var(--fs-xl);
	font-weight: 300;
	letter-spacing: 0.04em;
}
.venue-feature__list {
	display: flex;
	flex-direction: column;
	gap: var(--space-2xl);
}

.feature-item {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-2xl);
	align-items: center;
}
/* 偶数番目（02）はテキストを左、画像を右に */
.feature-item:nth-child(even) .feature-item__image { order: 2; }
.feature-item:nth-child(even) .feature-item__body  { order: 1; }
.feature-item__image {
	position: relative;
	aspect-ratio: 4 / 3;
	background-color: var(--color-bg-mute);
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.feature-item__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-muted);
	font-family: var(--font-en);
	font-size: var(--fs-sm);
	letter-spacing: var(--ls-wide);
}
.feature-item__body {
	padding: 0 var(--space-md);
}
.feature-item__num {
	font-family: var(--font-num);
	font-size: 3rem;
	font-weight: 300;
	letter-spacing: 0.02em;
	color: var(--color-secondary);
	line-height: 1;
	display: block;
	margin-bottom: var(--space-md);
}
.feature-item__en {
	font-family: var(--font-en);
	font-size: var(--fs-md);
	font-weight: 400;
	letter-spacing: var(--ls-wide);
	color: var(--color-primary);
	display: block;
	margin-bottom: var(--space-sm);
}
.feature-item__divider {
	display: block;
	width: 2.5rem;
	height: 1px;
	background: var(--color-border);
	margin: var(--space-sm) 0 var(--space-md);
}
.feature-item__title {
	font-family: var(--font-jp);
	font-size: var(--fs-lg);
	font-weight: 300;
	line-height: 1.7;
	letter-spacing: 0.04em;
	color: var(--color-text);
	margin-bottom: var(--space-sm);
}
.feature-item__desc {
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	line-height: var(--lh-loose);
	color: var(--color-text-muted);
	margin: 0;
}


/* ==========================================================================
   PRICE - モックv1.0準拠
   ========================================================================== */
.venue-price {
	padding: var(--space-3xl) 0;
	background-color: var(--color-bg-soft);
}
.venue-price__head {
	text-align: center;
	margin-bottom: var(--space-2xl);
}
.venue-price__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-md);
	letter-spacing: var(--ls-xwide);
	color: var(--color-secondary);
	margin-bottom: var(--space-xs);
}
.venue-price__title {
	font-family: var(--font-jp);
	font-size: var(--fs-xl);
	font-weight: 300;
	letter-spacing: 0.04em;
	margin-bottom: var(--space-sm);
}
.venue-price__lead {
	max-width: 36rem;
	margin: 0 auto;
	color: var(--color-text-muted);
	font-size: var(--fs-sm);
	line-height: var(--lh-loose);
}
.venue-price__grid {
	display: grid;
	grid-template-columns: 1fr 1.6fr;
	gap: var(--space-2xl);
	align-items: start;
}

/* ---------- 価格カード（左） ---------- */
.price-card {
	background: #FFFFFF;
	border: 1px solid var(--color-border);
	padding: var(--space-xl) var(--space-lg);
	position: sticky;
	top: calc(var(--header-height) + var(--space-md));
}
.price-card__label {
	font-family: var(--font-en);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-xwide);
	text-transform: uppercase;
	color: var(--color-secondary);
	display: block;
	text-align: center;
	margin-bottom: var(--space-md);
	padding-bottom: var(--space-sm);
	border-bottom: 1px solid var(--color-border-soft);
}
.price-card__capacity {
	text-align: center;
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	margin-bottom: var(--space-xs);
}
.price-card__capacity strong {
	font-family: var(--font-num);
	font-size: var(--fs-xl);
	font-weight: 300;
	color: var(--color-primary);
	margin: 0 0.15em;
}
.price-card__price-block {
	text-align: center;
	margin: var(--space-md) 0 var(--space-sm);
}
.price-card__price-amount {
	margin: 0;
	display: inline-flex;
	align-items: baseline;
	justify-content: center;
	color: var(--color-primary);
	font-family: var(--font-num);
	font-weight: 300;
	letter-spacing: 0.01em;
	line-height: 1;
}
.price-card__price-number {
	font-size: 2.75rem;
}
.price-card__price-currency {
	font-size: 1.5rem;
	margin-right: 0.1em;
}
.price-card__price-tax-label {
	font-family: var(--font-jp);
	font-size: 0.6875rem;
	color: var(--color-text-muted);
	letter-spacing: var(--ls-base);
	margin-left: 0.6em;
	font-weight: 400;
}
.price-card__note {
	font-size: 0.6875rem;
	color: var(--color-text-muted);
	text-align: center;
	margin: var(--space-sm) 0 var(--space-lg);
	line-height: 1.6;
	letter-spacing: var(--ls-base);
}
.price-card__cta {
	display: block;
	text-align: center;
	padding: 0.875rem 1.5rem;
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	letter-spacing: var(--ls-wide);
	background-color: var(--color-primary);
	color: var(--color-bg);
	border-radius: var(--radius-base);
	transition: all var(--transition-base);
	margin-bottom: 0.5rem;
	text-decoration: none;
}
.price-card__cta:hover {
	background-color: var(--color-accent);
	color: var(--color-bg);
}
.price-card__cta--outline {
	background: transparent;
	color: var(--color-primary);
	border: 1px solid var(--color-primary);
}
.price-card__cta--outline:hover {
	background: var(--color-primary);
	color: var(--color-bg);
}

/* ---------- 含まれるもの（右） ---------- */
.includes {
	background: #FFFFFF;
	border: 1px solid var(--color-border);
	padding: var(--space-xl);
}
.includes__head {
	display: flex;
	align-items: baseline;
	gap: var(--space-md);
	padding-bottom: var(--space-md);
	margin-bottom: var(--space-md);
}
.includes__head-en {
	font-family: var(--font-en);
	font-size: var(--fs-sm);
	letter-spacing: var(--ls-xwide);
	text-transform: uppercase;
	color: var(--color-secondary);
}
.includes__head-jp {
	font-family: var(--font-jp);
	font-size: var(--fs-md);
	font-weight: 400;
	color: var(--color-text);
}
.includes__head-count {
	margin-left: auto;
	font-family: var(--font-num);
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	letter-spacing: var(--ls-wide);
}
.includes__table {
	width: 100%;
	border-collapse: collapse;
	border-top: 1px solid var(--color-border);
	margin: 0;
	padding: 0;
	list-style: none;
}
.includes__row {
	display: grid;
	grid-template-columns: 11rem 1fr;
	border-bottom: 1px solid var(--color-border-soft);
}
.includes__row:last-child {
	border-bottom: 1px solid var(--color-border);
}
.includes__cell-label {
	padding: var(--space-md) var(--space-md) var(--space-md) 0;
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	font-weight: 400;
	color: var(--color-text);
	letter-spacing: var(--ls-base);
	line-height: 1.5;
	border-right: 1px solid var(--color-border);
	display: flex;
	align-items: flex-start;
}
.includes__cell-num {
	display: none;
}
.includes__cell-content {
	padding: var(--space-md) 0 var(--space-md) var(--space-md);
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	letter-spacing: var(--ls-base);
	line-height: 1.7;
}
.includes__row--featured .includes__cell-label {
	color: var(--color-primary);
	font-weight: 500;
}
.includes__empty {
	color: var(--color-border);
}


/* ==========================================================================
   GALLERY - 4列均等グリッド
   ========================================================================== */
.venue-gallery {
	padding: var(--space-3xl) 0;
}
.venue-gallery__head {
	text-align: center;
	margin-bottom: var(--space-xl);
}
.venue-gallery__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-md);
	letter-spacing: var(--ls-xwide);
	color: var(--color-secondary);
	margin-bottom: var(--space-xs);
}
.venue-gallery__title {
	font-family: var(--font-jp);
	font-size: var(--fs-xl);
	font-weight: 300;
}
.venue-gallery__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--space-sm);
	max-width: var(--container-wide);
	margin: 0 auto;
	padding: 0 var(--space-md);
}
.venue-gallery__item {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	cursor: zoom-in;
	transition: opacity var(--transition-base);
	border: none;
	padding: 0;
	background: none;
	width: 100%;
}
.venue-gallery__item:hover { opacity: 0.85; }
.venue-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}


/* ==========================================================================
   GALLERY MODAL
   ========================================================================== */
.gallery-modal {
	position: fixed;
	inset: 0;
	background: rgba(20, 16, 12, 0.92);
	backdrop-filter: blur(4px);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 1000;
	padding: var(--space-xl);
}
.gallery-modal[hidden] { display: none !important; }
.gallery-modal.is-open {
	display: flex;
}
.gallery-modal__inner {
	position: relative;
	max-width: 80rem;
	width: 100%;
	max-height: 85vh;
	display: flex;
	align-items: center;
	justify-content: center;
}
.gallery-modal__image {
	max-width: 100%;
	max-height: 85vh;
	display: block;
}
.gallery-modal__close,
.gallery-modal__nav {
	position: absolute;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: #fff;
	width: 3rem;
	height: 3rem;
	border-radius: var(--radius-full);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-en);
	font-size: var(--fs-lg);
	cursor: pointer;
	transition: background var(--transition-base);
}
.gallery-modal__close:hover,
.gallery-modal__nav:hover { background: rgba(255, 255, 255, 0.2); }
.gallery-modal__close { top: -3.5rem; right: 0; }
.gallery-modal__prev { left: -4rem; top: 50%; transform: translateY(-50%); }
.gallery-modal__next { right: -4rem; top: 50%; transform: translateY(-50%); }
.gallery-modal__counter {
	position: absolute;
	bottom: -2.5rem;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255, 255, 255, 0.7);
	font-family: var(--font-num);
	font-size: var(--fs-sm);
	letter-spacing: var(--ls-wide);
}


/* ==========================================================================
   INFO
   ========================================================================== */
.venue-info {
	padding: var(--space-3xl) 0;
}
.venue-info__head {
	text-align: center;
	margin-bottom: var(--space-xl);
}
.venue-info__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-md);
	letter-spacing: var(--ls-xwide);
	color: var(--color-secondary);
	margin-bottom: var(--space-xs);
}
.venue-info__title {
	font-family: var(--font-jp);
	font-size: var(--fs-xl);
	font-weight: 300;
}
.venue-info__list {
	max-width: var(--container-narrow);
	margin: 0 auto;
	border-top: 1px solid var(--color-border);
}
.venue-info__row {
	display: grid;
	grid-template-columns: 11rem 1fr;
	gap: var(--space-md);
	padding: var(--space-md) 0;
	border-bottom: 1px solid var(--color-border-soft);
}
.venue-info__label {
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	color: var(--color-text);
	font-weight: 400;
	margin: 0;
}
.venue-info__value {
	font-family: var(--font-jp);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	line-height: var(--lh-loose);
	margin: 0;
}


/* ==========================================================================
   RELATED - その他の洋婚会場（3列）
   ========================================================================== */
.venue-related {
	padding: var(--space-3xl) 0;
}
.venue-related__head {
	text-align: center;
	margin-bottom: var(--space-xl);
}
.venue-related__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-md);
	letter-spacing: var(--ls-xwide);
	color: var(--color-secondary);
	margin-bottom: var(--space-xs);
}
.venue-related__title {
	font-family: var(--font-jp);
	font-size: var(--fs-xl);
	font-weight: 300;
}
.venue-related__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-lg);
}
.related-card {
	display: block;
	color: inherit;
	text-decoration: none;
	transition: transform var(--transition-base);
}
.related-card:hover { transform: translateY(-2px); }
.related-card:hover .related-card__title { color: var(--color-secondary); }
.related-card__image {
	position: relative;
	aspect-ratio: 4 / 3;
	background-color: var(--color-bg-mute);
	background-size: cover;
	background-position: center;
	margin-bottom: var(--space-md);
	overflow: hidden;
}
.related-card__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-muted);
	font-family: var(--font-en);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-wide);
}
.related-card__en {
	display: block;
	font-family: var(--font-en);
	font-size: var(--fs-xs);
	letter-spacing: var(--ls-xwide);
	text-transform: uppercase;
	color: var(--color-secondary);
	margin-bottom: 0.25em;
}
.related-card__title {
	font-family: var(--font-jp);
	font-size: var(--fs-md);
	font-weight: 400;
	color: var(--color-text);
	line-height: 1.6;
	margin-bottom: 0.25em;
	transition: color var(--transition-base);
}
.related-card__subtitle {
	font-family: var(--font-jp);
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	margin: 0;
}


/* ==========================================================================
   Mobile
   ========================================================================== */
@media (max-width: 767px) {
	.venue-fv { padding-bottom: var(--space-xl); }
	.venue-fv__image { aspect-ratio: 4 / 3; }
	.venue-fv__card-wrap { margin-top: -2rem; padding: 0 var(--space-sm); }
	.venue-fv__card { padding: var(--space-lg) var(--space-md); }
	.venue-concept__inner { grid-template-columns: 1fr; gap: var(--space-md); }
	.feature-item { grid-template-columns: 1fr; gap: var(--space-md); }
	.feature-item:nth-child(even) .feature-item__image { order: 0; }
	.feature-item:nth-child(even) .feature-item__body  { order: 0; }
	.feature-item__body { padding: 0; }
	.feature-item__num { font-size: 2.25rem; }
	.venue-price__grid { grid-template-columns: 1fr; gap: var(--space-md); }
	.price-card { position: static; }
	.includes { padding: var(--space-md); }
	.includes__row { grid-template-columns: 7rem 1fr; }
	.includes__cell-label {
		padding: var(--space-sm) var(--space-sm) var(--space-sm) 0;
		font-size: var(--fs-xs);
	}
	.includes__cell-content {
		padding: var(--space-sm) 0 var(--space-sm) var(--space-sm);
		font-size: var(--fs-xs);
	}
	.venue-gallery__grid { grid-template-columns: 1fr 1fr; }
	.gallery-modal { padding: var(--space-md); }
	.gallery-modal__close { top: -3rem; right: 0; width: 2.5rem; height: 2.5rem; }
	.gallery-modal__prev { left: -0.5rem; }
	.gallery-modal__next { right: -0.5rem; }
	.venue-info__row { grid-template-columns: 1fr; gap: 0.25em; }
	.venue-related__list { grid-template-columns: 1fr; }
}


/* ==========================================================================
   和婚 詳細：臙脂アクセント（.venue-single--japanese スコープ上書き）
   英字ラベル・区切り線・含まれるもの先頭行を臙脂に。
   ソリッドボタンは一覧と同様ブランド色のまま抑える。
   ========================================================================== */
.venue-single--japanese {
	--wa-accent: #9E3B3B;
}
.venue-single--japanese .venue-fv__en,
.venue-single--japanese .venue-concept__label,
.venue-single--japanese .venue-price__en,
.venue-single--japanese .venue-feature__en,
.venue-single--japanese .feature-item__en,
.venue-single--japanese .venue-gallery__en,
.venue-single--japanese .includes__head-en,
.venue-single--japanese .venue-info__en,
.venue-single--japanese .common-cta__en {
	color: var(--wa-accent);
}
.venue-single--japanese .venue-fv__divider {
	background: var(--wa-accent);
}
/* 英字ラベル下の装飾線は非表示（和婚） */
.venue-single--japanese .feature-item__divider {
	display: none;
}
.venue-single--japanese .includes__row--featured .includes__cell-label {
	color: var(--wa-accent);
}

/* プラン料金セクションの背景（仮の和紙色。後で背景画像へ差し替え可能） */
.venue-single--japanese .venue-price {
	background-color: #FBF9F3;
}

/* 「このプランで相談する」を臙脂に（見学予約のアウトラインはそのまま） */
.venue-single--japanese .price-card__cta:not(.price-card__cta--outline) {
	background-color: var(--wa-accent);
}
.venue-single--japanese .price-card__cta:not(.price-card__cta--outline):hover {
	background-color: #872F2F;
}