/**
 * Facility pages - No.8 resort_latest0419 structure.
 */
.l-facility {
	--facility-forest: #0e3d2e;
	--facility-forest-soft: rgba(14, 61, 46, 0.08);
	--facility-paper: rgba(255, 255, 255, 0.94);
	--facility-muted: #66655f;
	--facility-sand: #ece6dd;
}

.p-facility-archive__kicker {
	margin: 0 0 14px;
	font-size: 10px;
	letter-spacing: .2em;
	color: rgba(14, 61, 46, .56);
}

.p-facility-archive__section-intro {
	margin: 36px 0 20px;
}

.p-facility-archive__section-title {
	margin: 0;
}

.facility-card-full {
	background: var(--facility-paper);
	border: 1px solid var(--facility-forest-soft);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 10px 24px rgba(27, 44, 36, .035);
	display: grid;
	grid-template-columns: minmax(0, .98fr) minmax(0, 1.02fr);
	/* SAM様指摘（PC=sam_good.png通り維持）：見出し(heading)は右カラム上部・画像(visual)は左カラムを縦に貫通。
	   見出しをvisual/contentから独立させ、SP側のみ表示順を変えられるようにする（下のmax-width:900pxで上書き）。 */
	grid-template-areas:
		"visual heading"
		"visual content";
	/* 施設タブ（#facility-{ID}アンカー）遷移で固定ヘッダー+サブナビに画像が隠れる不具合の是正。
	   .l-pageのpadding-top（--orn-fixed-top+余白）と同じ考え方をアンカー着地点にも適用（§22同クラス適用）。 */
	scroll-margin-top: calc(var(--orn-fixed-top) + 16px);
}

.facility-card-full__heading {
	grid-area: heading;
	padding: 26px 26px 0;
	align-self: start;
}

/* No.60 加藤さん提供レイアウト参考：メイン画像＋見どころスライダーを左カラムにまとめる（実際のgridアイテムはこちら） */
.facility-card-full__visual {
	grid-area: visual;
	padding: 26px 26px 24px;
	align-self: start;
	min-width: 0;
}

.facility-card-full__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--facility-sand);
	border-radius: 14px;
	overflow: hidden;
}

.facility-card-full__image,
.facility-card-full__media > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.facility-card-full__image--empty {
	height: 100%;
	background: linear-gradient(135deg, #d9ded9, #c6d1cb);
}

.facility-card-full__logo {
	margin: 0 0 14px;
	max-width: 220px;
}

.facility-card-full__logo-image {
	max-height: 28px;
	width: auto;
	object-fit: contain;
}

.facility-card-full__type {
	display: inline-flex;
	align-items: center;
	width: fit-content;
	padding: 8px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .84);
	font-size: 11px;
	letter-spacing: .08em;
	color: rgba(14, 61, 46, .76);
}

.facility-card-full__content {
	grid-area: content;
	padding: 0 26px 24px;
}

.facility-card-full__kicker {
	margin: 0 0 10px;
	font-size: 11px;
	letter-spacing: .2em;
	color: rgba(14, 61, 46, .56);
	text-transform: uppercase;
}

/* 第1カテゴリ（目的）は複数付くため横並び＋折返し。各タグの見た目は既存ピルをそのまま使う。 */
.facility-card-full__types {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 12px;
}

.facility-card-full__type {
	margin: 0 0 12px;
	background: rgba(93, 202, 165, .1);
}

.facility-card-full__types .facility-card-full__type {
	margin: 0;
}

.facility-card-full__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--serif);
	font-size: 24px;
	font-weight: 300;
	line-height: 1.62;
	letter-spacing: .02em;
	color: #31322e;
}

.facility-card-full__dayline {
	margin: 12px 0 0;
	color: rgba(14, 61, 46, .72);
	font-size: 12px;
	letter-spacing: .06em;
}

.facility-card-full__dayline span,
.facility-highlights__dayline span {
	margin-right: .75em;
	color: rgba(14, 61, 46, .52);
}

.facility-card-full__catch,
.facility-highlights__catch {
	margin: 12px 0 8px;
	font-family: var(--wp--preset--font-family--serif);
	font-size: 20px;
	font-weight: 400;
	line-height: 1.82;
	letter-spacing: .04em;
	color: rgba(14, 61, 46, .82);
}

.facility-card-full__summary,
.facility-card-full__story,
.facility-about__text {
	color: #575650;
	font-size: 16px;
	line-height: 1.92;
}

.facility-highlights__track {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin-top: 18px;
}

.facility-card-full__flow-wrap {
	margin-top: 18px;
}

.facility-card-full__flow-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.facility-card-full__flow-title {
	margin: 0;
	font-size: 13px;
	letter-spacing: .04em;
	color: rgba(14, 61, 46, .76);
}

.facility-card-full__flow-nav {
	display: flex;
	gap: 8px;
}

.facility-card-full__flow-btn {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 1px solid rgba(14, 61, 46, .18);
	background: #fff;
	color: rgba(14, 61, 46, .76);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	line-height: 1;
	transition: background .2s ease, border-color .2s ease;
}

.facility-card-full__flow-btn:hover {
	background: var(--facility-sand);
	border-color: rgba(14, 61, 46, .3);
}

.facility-card-full__flow-btn:disabled {
	opacity: .35;
	cursor: default;
}

/* No.60: 探すページ②の見どころ写真は加藤さん指示で4:3スライダー化。
   .p-scene-orbit__list（scene.css）と同じスクロールスナップ方式を拡張適用（無限マーケーは非採用＝キャプションを読ませる用途のため）。*/
.facility-card-full__flow {
	display: flex;
	gap: 12px;
	padding-bottom: 4px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
}

.facility-card-full__flow-card {
	flex: 0 0 180px;
	scroll-snap-align: start;
	align-self: start;
}

.facility-card-full__flow-card,
.facility-highlights__card {
	margin: 0;
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	border: 1px solid rgba(14, 61, 46, .08);
}

/* No.60 SAM様指摘①是正：assets/css/common.css の全称 img{height:100%} リセットに勝つには
   height を明示（今朝のfacility-card-full__mediaと同根＝align-items:stretchで親figureに確定高さが付き、
   height:100%が解決してaspect-ratioが無効化されていた）。align-self:startで親figureのストレッチ自体も止める。 */
.facility-card-full__flow-image,
.facility-highlights__image {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.facility-card-full__flow-card figcaption,
.facility-highlights__card figcaption {
	padding: 10px 12px;
	color: #64635d;
	font-size: 12px;
	line-height: 1.7;
}

.facility-card-full__story {
	margin-top: 18px;	
	display: grid;
	gap: 12px;
}

.facility-card-full__story p {
	margin: 0;
}

.facility-card-full__story strong {
	display: block;
	margin-bottom: 4px;
	color: rgba(14, 61, 46, .76);
	font-size: 12px;
	letter-spacing: .08em;
}

.facility-card-full__meta {
	margin: 18px 0 0;
	padding-top: 16px;
	border-top: 1px solid rgba(14, 61, 46, .08);
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px 14px;
}

.facility-card-full__meta div {
	min-width: 0;
}

.facility-card-full__meta dt {
	color: rgba(14, 61, 46, .62);
	font-size: 11px;
	letter-spacing: .1em;
}

.facility-card-full__meta dd {
	margin: 4px 0 0;
	color: #4d4c47;
	font-size: 12px;
	line-height: 1.7;
}

.facility-card-full__actions {
	margin-top: 20px;
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}

.facility-card-full__link {
	display: inline;
	color: var(--orn-link-color, #E08A3C);
	font-size: 14px;
	letter-spacing: 0;
	text-decoration: underline;
	text-underline-offset: .18em;
	overflow-wrap: anywhere;
}

.facility-card-full__link::after {
	content: none;
}

.facility-highlights,
.facility-about {
	max-width: 860px;
	margin: 36px auto 0;
}

.facility-highlights__lead {
	max-width: 720px;
	margin: 0 auto 20px;
	text-align: center;
}

.facility-highlights__dayline {
	margin: 0 0 10px;
	font-size: 12px;
	letter-spacing: .08em;
	color: rgba(14, 61, 46, .72);
}

.facility-about {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.facility-about__panel {
	padding: 24px;
	border-radius: 22px;
	background: rgba(255, 255, 255, .9);
	border: 1px solid rgba(14, 61, 46, .08);
	box-shadow: 0 10px 24px rgba(27, 44, 36, .03);
}

.facility-about__kicker {
	margin: 0 0 8px;
	font-size: 10px;
	letter-spacing: .2em;
	color: rgba(14, 61, 46, .52);
	text-transform: uppercase;
}

.facility-about__title {
	margin: 0 0 12px;
	font-family: var(--wp--preset--font-family--serif);
	/* No.64: clamp撤去＝h2(セクション見出し)はtheme.jsonの正準24pxへ統一（旧18-24pxで幅依存） */
	font-weight: 300;
	line-height: 1.8;
	color: #3b433f;
}

@media (max-width: 900px) {
	/* No.60横崩れ再発防止：単一fr列でも実装の"auto"最小サイズ（min-content）でトラックが膨張しうるため、
	   デスクトップ側同様 minmax(0, 1fr) で床を明示（今朝のfacility-card-full横崩れと同根＝§5仕組み化）。
	   facility-card-full__flow は本日display:flexへ変更済み＝grid-template-columns指定は対象外（削除）。 */
	.facility-card-full,
	.facility-about,
	.facility-card-full__meta,
	.facility-highlights__track {
		grid-template-columns: minmax(0, 1fr);
	}
	/* SAM様指摘（SP=施設名から始まる構成に）：見出し→画像→本文の順に並べ替え。PC(2カラム)側は上のarea定義のまま。 */
	.facility-card-full {
		grid-template-areas:
			"heading"
			"visual"
			"content";
	}
	.facility-card-full__heading {
		padding: 24px 20px 0;
	}
	.facility-card-full__content {
		padding: 0 20px 22px;
	}
	.facility-highlights,
	.facility-about {
		margin-top: 28px;
	}
}