/**
 * WestVibe responsive hardening.
 *
 * Loaded after every page-specific stylesheet so shared mobile safeguards do
 * not have to be duplicated across the Home, Services, Team, Careers,
 * Memberships, Education and Blog templates.
 *
 * @package WestVibe_Child
 */

/* Prevent intrinsic media or long content from widening the document. */
html {
	max-width: 100%;
	overflow-x: clip;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

/*
 * Twenty Twenty-Five injects its fluid "large" preset directly on body.
 * Without this scoped reset, any component that does not declare a local
 * size inherits up to 36px and the parent theme also adds outer page padding.
 */
body.wp-child-theme-westvibe-child {
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-weight: 400;
	letter-spacing: normal;
	line-height: 1.65;
}

body,
.wv-site,
main,
section,
article {
	min-width: 0;
	max-width: 100%;
}

:where(img, picture, video, canvas, svg, iframe) {
	max-width: 100%;
}

:where(.wv-service-categories__carousel, .wv-service-categories__viewport,
	.wv-client-logos__viewport, .wv-about-westvibe__carousel-shell,
	.wv-about-westvibe__carousel-viewport, .wv-testimonials__viewport) {
	min-width: 0;
	max-width: 100%;
}

:where(.wp-block-table, .wv-color-table-wrap) {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

:where(input, select, textarea, button) {
	max-width: 100%;
}

/* Solid, readable navigation for every page except the landing hero. */
.wv-site-header[data-transparent="0"] {
	background: rgba(255, 255, 255, 0.96);
	border-bottom-color: rgba(200, 164, 93, 0.26);
	-webkit-backdrop-filter: blur(18px);
	backdrop-filter: blur(18px);
	box-shadow: 0 12px 34px rgba(17, 17, 17, 0.08);
}

.wv-site-header[data-transparent="0"] :is(.wv-nav-list a, .wv-desktop-nav > ul a) {
	color: rgba(17, 17, 17, 0.82);
	text-shadow: none;
}

.wv-site-header[data-transparent="0"] .wv-logo--has-dark .wv-logo-img--light {
	display: none;
}

.wv-site-header[data-transparent="0"] .wv-logo--has-dark .wv-logo-img--dark {
	display: block;
	filter: none;
}

.wv-site-header[data-transparent="0"] .wv-hamburger-line {
	background: var(--wv-text-dark, #111111);
}

/* Keep the full desktop menu comfortable instead of letting it hit the logo. */
@media (min-width: 1181px) and (max-width: 1480px) {
	.wv-header-shell {
		width: min(calc(100% - 32px), 1440px);
		grid-template-columns: auto minmax(0, 1fr) auto;
		gap: clamp(12px, 1.35vw, 20px);
	}

	.wv-nav-list,
	.wv-desktop-nav > ul {
		gap: clamp(12px, 1.45vw, 22px);
	}

	.wv-nav-list a,
	.wv-desktop-nav > ul a {
		font-size: clamp(0.66rem, 0.72vw, 0.78rem);
		letter-spacing: 0.1em;
	}

	.wv-header-actions {
		gap: 10px;
	}

	.wv-header-actions .wv-button--primary {
		min-width: 164px;
		padding-inline: 18px;
	}
}

/* A stale open menu must never cover the desktop after device rotation. */
@media (min-width: 1181px) {
	.wv-mobile-menu {
		display: none !important;
	}

	body.wv-menu-open {
		overflow: auto !important;
	}
}

/* Tablet and mobile navigation. */
@media (max-width: 1180px) {
	.wv-site-header {
		width: 100%;
	}

	.wv-header-shell {
		width: min(calc(100% - 32px), 960px);
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 12px;
	}

	.wv-logo {
		min-width: 0;
		max-width: calc(100vw - 96px);
		justify-content: flex-start;
	}

	.wv-logo-img {
		height: var(--wv-logo-h-mobile, 34px) !important;
		width: auto;
		max-width: min(54vw, 220px);
	}

	.wv-header-actions {
		display: inline-flex !important;
		position: relative;
		z-index: 3;
		min-width: 0;
		gap: 10px;
	}

	.wv-desktop-nav,
	.wv-site-header .wv-header-actions > .wv-lang-switcher,
	.wv-site-header .wv-header-actions > .wv-header-cta {
		display: none !important;
	}

	button.wv-menu-toggle {
		display: inline-flex !important;
		flex: 0 0 44px;
		min-width: 44px;
		visibility: visible !important;
		opacity: 1 !important;
		touch-action: manipulation;
	}

	.wv-mobile-menu {
		align-items: flex-start;
		justify-content: center;
		padding:
			max(12px, env(safe-area-inset-top))
			max(12px, env(safe-area-inset-right))
			max(12px, env(safe-area-inset-bottom))
			max(12px, env(safe-area-inset-left));
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
	}

	.wv-mobile-menu-inner {
		width: min(100%, 620px);
		min-height: calc(100dvh - 24px);
		margin: 0 auto;
		padding: 72px clamp(18px, 5vw, 34px) 32px;
		gap: clamp(22px, 4vh, 34px);
		border-radius: 26px;
		justify-content: center;
	}

	.wv-mobile-nav,
	.wv-mobile-nav-list {
		width: 100%;
		min-width: 0;
	}

	.wv-mobile-nav-list {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.wv-mobile-nav-list > li > a {
		font-size: clamp(1.65rem, 4.2vw, 2.45rem);
		line-height: 1.08;
		overflow-wrap: break-word;
	}

	.wv-mobile-menu .wv-lang-switcher,
	.wv-mobile-menu .wv-lang-switcher--mobile {
		display: inline-flex;
		flex: 0 0 auto;
	}

	.wv-mobile-cta {
		width: min(100%, 320px);
		justify-content: center;
	}

	/* Keep wide editorial tables usable without widening the page. */
	.wv-color-page .wv-color-table-wrap {
		width: 100%;
		max-width: calc(100vw - 32px);
		overscroll-behavior-inline: contain;
	}
}

@media (max-width: 768px) {
	:where(.wv-container, .wv-blog-archive__container,
		.wv-hairstylists__container, .wv-careers__container,
		.wv-memberships__container) {
		width: min(calc(100% - 32px), 720px);
		margin-inline: auto;
	}

	.wv-header-shell {
		height: 64px;
		width: calc(100% - 24px);
	}

	.wv-logo-img {
		max-width: min(52vw, 190px);
	}

	/* Headings may wrap, but must never force horizontal scrolling. */
	:where(.wv-hero__title, .wv-page-hero__title, .wv-hc-hero__title,
		.wv-color-hero__title, .wv-edu-hero h1, .wv-blog-post__title,
		.wv-blog-archive__hero h1, .wv-maintenance__title) {
		max-width: 100%;
		overflow-wrap: break-word;
		word-break: normal;
		text-wrap: balance;
	}

	:where(.wv-page-hero__subtitle, .wv-hero__subtitle, .wv-hero__desc,
		.wv-blog-post__content, .wv-policies__section,
		.wv-careers__field, .wv-edu-program__main) {
		min-width: 0;
		overflow-wrap: break-word;
	}

	/* Embedded maps and editorial media follow their content column. */
	:where(.wv-visit iframe, .wv-color-visit-section iframe,
		.wv-treatments-visit iframe, .wv-memberships iframe) {
		width: 100%;
		max-width: 100%;
	}

	/* Mobile sheets remain usable with short browser viewports and keyboards. */
	.wv-promo-modal,
	.wv-appointment-modal,
	.wv-policy-modal {
		padding-bottom: env(safe-area-inset-bottom);
	}

	.wv-promo-modal__dialog,
	.wv-appointment-modal__dialog,
	.wv-policy-modal__dialog {
		max-height: calc(100dvh - 12px);
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
	}

	.wv-promo-modal__close {
		top: 12px;
		right: 12px;
	}

	.wv-promo-modal__input,
	.wv-promo-modal__country-code,
	.wv-appointment-form input,
	.wv-appointment-form select,
	.wv-appointment-form textarea,
	.wv-careers__form input,
	.wv-careers__form select,
	.wv-careers__form textarea,
	.wv-edu-form input,
	.wv-edu-form select,
	.wv-edu-form textarea {
		font-size: 16px;
	}

	.wv-footer-main :where(a, p, address, li) {
		overflow-wrap: break-word;
	}
}

@media (max-width: 480px) {
	.wv-mobile-menu-inner {
		width: 100%;
		min-height: calc(100dvh - 16px);
		padding: 66px 18px 26px;
		gap: 20px;
		border-radius: 20px;
	}

	.wv-mobile-nav-list > li > a {
		font-size: clamp(1.45rem, 7vw, 2rem);
	}

	.wv-mobile-nav-list .sub-menu,
	.wv-mobile-nav-list .wv-submenu {
		margin-block: 8px 12px !important;
	}

	.wv-mobile-nav-list .sub-menu > li > a,
	.wv-mobile-nav-list .wv-submenu > li > a {
		padding-block: 7px !important;
		font-size: 0.68rem !important;
	}

	/* Education uses intentionally large display type; cap it on narrow phones. */
	.wv-edu-hero h1,
	.wv-edu-section-heading h2,
	.wv-edu-educator__copy h2,
	.wv-edu-finder h2 {
		font-size: clamp(2.45rem, 12vw, 3.35rem);
	}

	.wv-edu-path-card strong,
	.wv-edu-transition h2 {
		font-size: clamp(2.35rem, 11vw, 3.15rem);
	}

	.wv-edu-program {
		grid-template-columns: 30px minmax(0, 1fr);
	}

	.wv-edu-form {
		padding-inline: 18px;
	}

	.wv-promo-modal__phone-field {
		grid-template-columns: 62px minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wv-mobile-menu,
	.wv-mobile-menu-inner {
		scroll-behavior: auto;
	}
}
