body.tc-mobile-menu-open {
	overflow: hidden;
}

/* TODO: Figma에 없음 — 임의값 */
/* Mobile-only shared header. Desktop and tablet values remain unchanged. */
@media (max-width: 767px) {
	.tc-el-home .tc-el-header,
	.tc-el-home .tc-el-header__inner {
		min-height: var(--wp--custom--global-header--mobile-height);
	}

	.tc-el-home .tc-el-header__inner {
		display: grid;
		grid-template-columns: minmax(0, 1fr) var(--wp--custom--layout--touch-target);
		gap: var(--wp--preset--spacing--xs);
		width: min(
			calc(100% - (var(--wp--custom--global-header--mobile-gutter) * 2)),
			var(--wp--custom--layout--header-wide)
		);
	}

	.tc-el-home .tc-el-brand {
		min-width: 0;
		white-space: nowrap;
	}

	.tc-el-home .tc-el-reservation {
		display: none;
	}

	.tc-el-home .tc-d1-menu-toggle,
	.tc-el-home .tc-d2-menu-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		justify-self: end;
		width: var(--wp--custom--layout--touch-target);
		height: var(--wp--custom--layout--touch-target);
		min-width: var(--wp--custom--layout--touch-target);
		min-height: var(--wp--custom--layout--touch-target);
		padding: 0;
		border: 0;
		border-radius: var(--wp--custom--radius--button);
		background-color: transparent;
		background-image:
			linear-gradient(currentColor, currentColor),
			linear-gradient(currentColor, currentColor),
			linear-gradient(currentColor, currentColor);
		background-repeat: no-repeat;
		background-position:
			center calc(50% - var(--wp--custom--global-header--mobile-icon-gap)),
			center,
			center calc(50% + var(--wp--custom--global-header--mobile-icon-gap));
		background-size:
			var(--wp--custom--global-header--mobile-icon-width) var(--wp--custom--global-header--mobile-icon-bar-height),
			var(--wp--custom--global-header--mobile-icon-width) var(--wp--custom--global-header--mobile-icon-bar-height),
			var(--wp--custom--global-header--mobile-icon-width) var(--wp--custom--global-header--mobile-icon-bar-height);
		color: var(--wp--preset--color--primary-deep);
		font: inherit;
		cursor: pointer;
	}

	.tc-el-home .tc-d1-menu-toggle span,
	.tc-el-home .tc-d2-menu-toggle span {
		position: absolute;
		inline-size: var(--wp--custom--border-width--hairline);
		block-size: var(--wp--custom--border-width--hairline);
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.tc-el-home .tc-el-nav {
		position: fixed;
		inset: var(--wp--custom--global-header--mobile-height) 0 0 auto;
		z-index: var(--wp--custom--z-index--header);
		display: flex;
		flex-direction: column;
		align-items: stretch;
		width: min(100%, var(--wp--custom--global-header--mobile-menu-panel));
		height: calc(100svh - var(--wp--custom--global-header--mobile-height));
		gap: 0;
		padding: var(--wp--preset--spacing--lg) var(--wp--custom--global-header--mobile-gutter);
		overflow-y: auto;
		background: var(--wp--preset--color--white);
		visibility: hidden;
		pointer-events: none;
		transform: translateX(100%);
		transition:
			transform var(--wp--custom--global-header--transition) var(--wp--custom--motion--ease),
			visibility 0s linear var(--wp--custom--global-header--transition);
	}

	.tc-el-home .tc-el-nav a {
		display: flex;
		align-items: center;
		min-height: var(--wp--custom--layout--touch-target);
		border-bottom: var(--wp--custom--border-width--hairline) solid var(--wp--preset--color--border-soft);
	}

	.tc-el-home.is-menu-open .tc-el-nav {
		visibility: visible;
		pointer-events: auto;
		transform: translateX(0);
		transition-delay: 0s;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tc-el-home .tc-el-nav {
		transition-duration: var(--wp--custom--motion--none);
	}
}