/* =====================================================
   HEADER — TABLET AND MOBILE
===================================================== */

@media (max-width: 1024px) {

	.site-header {
		position: relative;
		z-index: 9999;
		
	}

	.site-header__branding {
		box-sizing: border-box;
		min-height: 76px;
		padding: 12px 24px !important;
	}

	.site-header__branding p {
		margin: 0 !important;
		text-align: center;
	}

	.site-header__text-logo {
		font-size: clamp(22px, 4vw, 34px) !important;
		line-height: 1.1;
		letter-spacing: 2px;
		text-align: center;
	}

	.site-header__navigation-inner {
		display: grid !important;
		grid-template-columns: 44px 1fr !important;
		align-items: center !important;
		box-sizing: border-box;
		width: min(calc(100% - 40px), 940px) !important;
		min-height: 52px;
		margin: 0 auto !important;
		gap: 12px !important;
	}

	.site-header__contact {
		display: none !important;
	}

	.site-header__menu {
		grid-column: 1;
		grid-row: 1;
		justify-self: start !important;
	}

	.site-header__actions {
		grid-column: 2;
		grid-row: 1;
		justify-self: end !important;
		margin: 0 !important;
	}

	.site-header__actions p {
		margin: 0 !important;
	}

	/* Force Gutenberg hamburger on tablet */
	.site-header__menu
	.wp-block-navigation__responsive-container-open {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		padding: 8px;
		color: #291a17;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container-open svg {
		width: 27px;
		height: 27px;
	}

	/* Hide desktop navigation until hamburger opens */
	.site-header__menu
	.wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container.is-menu-open {
		position: fixed;
		inset: 0;
		display: flex !important;
		box-sizing: border-box;
		width: 100%;
		height: 100dvh;
		padding: 80px 30px 35px !important;
		background: #f3f1ef !important;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container-content {
		align-items: center !important;
		justify-content: center !important;
		padding-top: 0 !important;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__container {
		align-items: center !important;
		justify-content: center !important;
		gap: 22px !important;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content {
		padding: 5px 10px !important;
		font-size: 24px !important;
		line-height: 1.2;
		text-align: center;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container-close {
		top: 24px;
		right: 24px;
	}

	.site-header__tour-link {
		font-size: 13px !important;
		letter-spacing: 0.5px;
		white-space: nowrap;
	}
}


/* =====================================================
   MOBILE HEADER
===================================================== */

@media (max-width: 600px) {

	.site-header__branding {
		min-height: 66px !important;
		padding: 10px 16px !important;
	}

	.site-header__text-logo {
		font-size: clamp(19px, 6vw, 25px) !important;
		letter-spacing: 1.5px;
	}

	.site-header__navigation-inner {
		width: calc(100% - 28px) !important;
		min-height: 48px;
	}

	.site-header__tour-link {
		font-size: 11px !important;
	}

	.site-header__tour-link::before {
		width: 13px;
		height: 13px;
	}

	.site-header__menu
	.wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content {
		font-size: 21px !important;
	}
}
/* =========================================================
   THE CLUB – MOBILE NAVIGATION
========================================================= */

@media (max-width: 781px) {
	/* Full-screen turquoise mobile menu */
	.site-header
	.wp-block-navigation__responsive-container.is-menu-open {
		position: fixed;
		inset: 0;
		z-index: 999999;
		display: flex;
		width: 100%;
		height: 100dvh;
		padding: 90px 30px 45px !important;
		background: #00929f !important;
		overflow: hidden;
	}

	/* Faint fern watermark */
	.site-header
	.wp-block-navigation__responsive-container.is-menu-open::before {
		content: "";
		position: absolute;
		top: 52%;
		left: 50%;
		z-index: 0;
		width: min(72vw, 310px);
		aspect-ratio: 1;
		background-image: url("/wp-content/uploads/2026/07/Icon-white.svg");
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
		opacity: 0.09;
		transform: translate(-50%, -50%);
		pointer-events: none;
	}

	/* Keep menu content above watermark */
	.site-header
	.wp-block-navigation__responsive-container-content {
		position: relative;
		z-index: 2;
		display: flex;
		align-items: center !important;
		justify-content: center !important;
		width: 100%;
		height: 100%;
		padding: 0 !important;
	}

	.site-header
	.wp-block-navigation__container {
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 26px !important;
		width: 100%;
	}

	.site-header
	.wp-block-navigation-item {
		width: 100%;
		text-align: center;
	}

	.site-header
	.wp-block-navigation-item__content {
		display: inline-block;
		color: #fff !important;
		font-size: 24px !important;
		line-height: 1.2;
		text-align: center;
		text-decoration: none;
	}

	/* Mobile close button */
	.site-header
	.wp-block-navigation__responsive-container-close {
		top: -60px;
		right: 25px;
		z-index: 3;
		color: #fff !important;
	}

	.site-header
	.wp-block-navigation__responsive-container-close svg {
		width: 32px;
		height: 32px;
		fill: currentColor;
	}

	/* Book a Tour menu link */
	.site-header
	.wp-block-navigation-item:last-child
	.wp-block-navigation-item__content {
		padding: 13px 25px;
		border: 1px solid #fff;
		color: #fff !important;
		font-size: 15px !important;
		text-transform: uppercase;
	}
}