/**
 * 全站响应式与块编辑器样式衔接。
 */

html,
body {
	max-width: 100%;
	overflow-x: clip;
}

img,
video,
iframe {
	max-width: 100%;
	height: auto;
}

.xif-container {
	width: 100%;
}

/* 大屏保持内容居中，避免超宽屏内容拉散 */
@media (min-width: 1600px) {
	:root {
		--xif-container: 1320px;
	}
}

@media (max-width: 1200px) {
	:root {
		--xif-gutter: 18px;
	}
}

@media (max-width: 1024px) {
	.xif-headutils {
		gap: 18px;
	}

	.xif-searchrow .xif-search__mode {
		width: 140px;
	}

	.xif-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 900px) {
	.xif-offers-hero,
	.xif-ind-hero {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.xif-offers-hero__media,
	.xif-ind-hero__media {
		min-height: 210px !important;
	}

	.xif-tracking-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.xif-tracking-side {
		position: static;
	}
}

@media (max-width: 782px) {
	:root {
		--xif-gutter: 16px;
	}

	.xif-headutils {
		gap: 14px;
	}

	.xif-headutils a {
		font-size: 13px;
	}

	.xif-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 22px;
	}

	.xif-footer__address {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
	}

	.xif-block-hero .wp-block-columns,
	.xif-block-section .wp-block-columns {
		gap: 16px;
	}

	.xif-block-hero,
	.xif-block-cta,
	.xif-block-card {
		border-radius: 0;
	}
}

@media (max-width: 620px) {
	.xif-headutils a {
		gap: 0;
		font-size: 0;
	}

	.xif-headutils .xif-icon {
		width: 20px;
		height: 20px;
	}

	.xif-headutils .xif-cart-count {
		font-size: 9px;
	}

	.xif-footer__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.xif-footer__cert {
		flex-wrap: wrap;
	}

	.xif-checkout-message__actions,
	.xif-order-pay__actions {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}

	.xif-checkout-message__actions .xif-btn,
	.xif-checkout-message__actions .xif-cart-btn,
	.xif-order-pay__actions .xif-btn,
	.xif-order-pay__actions .xif-cart-btn {
		flex: 1 1 auto;
	}

	.xif-account-table,
	.xif-compare-table,
	.xif-cart-table {
		display: block;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		font-size: 12px;
	}

	.xif-block-hero,
	.xif-block-cta {
		padding: 24px 18px;
	}

	.xif-block-hero__media {
		min-height: 180px;
	}
}

@media (max-width: 480px) {
	:root {
		--xif-gutter: 14px;
	}

	.xif-headbar__inner {
		gap: 8px;
	}

	.xif-headutils {
		gap: 12px;
	}

	.xif-logo__mark {
		max-width: 54px;
	}

	.xif-searchrow {
		padding: 8px 0;
	}

	.xif-searchrow .xif-search--bar {
		height: 42px;
	}

	.xif-searchrow .xif-search__input {
		font-size: 12px;
	}

	.xif-footer__pay {
		max-width: 100%;
	}
}