/**
 * VR Showroom 卡片 — 参考 Case 列表卡片布局
 *
 * 依赖：page-overrides.php 按 page-id-3698 条件加载
 *
 * 1. 卡片白底圆角阴影 + flex column 撑满行高
 * 2. 图片 16:9
 * 3. 按钮 margin-top:auto 推到底部对齐
 */

/* ---- 卡片外层 ---- */

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] > .wp-block-spectra-container,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] > .wp-block-spectra-container {
	background: #fff;
	border-radius: 8px;
	overflow: hidden !important;
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	display: flex !important;
	flex-direction: column !important;
	height: 100% !important;
}

/* ---- Feature 图片 16:9（仅每张卡片的第一张图，不影响二维码） ---- */

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] > .wp-block-spectra-container > .wp-block-spectra-container:first-child > .wp-block-image:first-child,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] > .wp-block-spectra-container > .wp-block-spectra-container:first-child > .wp-block-image:first-child {
	width: 100% !important;
}

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] > .wp-block-spectra-container > .wp-block-spectra-container:first-child > .wp-block-image:first-child img,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] > .wp-block-spectra-container > .wp-block-spectra-container:first-child > .wp-block-image:first-child img {
	aspect-ratio: 16 / 9;
	width: 100% !important;
	height: auto !important;
	object-fit: cover;
	display: block;
}

/* ---- QR 行：二维码左 + 文字右 ---- */

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] .wp-block-columns .wp-block-column,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] .wp-block-columns .wp-block-column {
	display: flex !important;
	flex-direction: row !important;
	align-items: center;
	gap: 8px;
}

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] .wp-block-columns .wp-block-image,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] .wp-block-columns .wp-block-image {
	width: 60px !important;
	flex-shrink: 0;
}

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] .wp-block-columns img,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] .wp-block-columns img {
	width: 60px !important;
	height: 60px !important;
	aspect-ratio: auto !important;
}

body.page-id-3698 [data-spectra-id^="spectra-moxmeh7h"] .wp-block-columns p,
body.page-id-3698 [data-spectra-id^="spectra-8857887b"] .wp-block-columns p {
	margin: 0 !important;
	font-size: 12px !important;
}

/* ---- Banner text: reduce padding on tablet/mobile ---- */

@media (max-width: 1023px) {
	/* Banner container */
	body.page-id-3698 [data-spectra-id="spectra-vr-hero-banner"] {
		padding-left: 40px !important;
		padding-right: 40px !important;
	}

	/* Description text */
	body.page-id-3698 [data-spectra-id="spectra-b5e618ed-4f93-4133-9afe-8c8a73746730"] {
		padding-left: 60px !important;
		padding-right: 60px !important;
	}
}

@media (max-width: 781px) {
	/* Banner container */
	body.page-id-3698 [data-spectra-id="spectra-vr-hero-banner"] {
		padding-left: 24px !important;
		padding-right: 24px !important;
	}

	/* Description text */
	body.page-id-3698 [data-spectra-id="spectra-b5e618ed-4f93-4133-9afe-8c8a73746730"] {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Main title: prevent line overlap on wrap */
	body.page-id-3698 [data-spectra-id="spectra-vr-hero-banner"] p {
		line-height: 1.15 !important;
	}

	/* Fix: broken spacer → give paragraphs breathing room */
	body.page-id-3698 [data-spectra-id="spectra-vr-hero-banner"] p + p {
		margin-top: 12px !important;
	}

	/* Card grid: 1 column, reduce padding + gap */
	body.page-id-3698 [data-spectra-id="spectra-moxmeh7h-tbrwy5"],
	body.page-id-3698 [data-spectra-id="spectra-8857887b-64b7-49fe-9284-da0820d82827"] {
		padding-left: 12px !important;
		padding-right: 12px !important;
		gap: 12px !important;
	}
}