/* Section wrapper — white, sits 59px below the nav (Figma: title y661, nav
   ends 602), 38px above the slider */
.bsw-space-intro.wp-block-group.alignfull {
	background: #fff;
	padding: 59px 20px 38px !important;
	margin-block: 0 !important;
}

/* Space title — Cormorant uppercase, same voice as the venues-intro h1.
   Max-width matches the Figma text box so "Grand Scheme Ballroom" wraps to
   two lines at 60px like the design. */
h2.bsw-space-intro__title {
	font-family: var(--wp--preset--font-family--cormorant, 'Cormorant', serif) !important;
	font-size: 60px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	letter-spacing: 0.2em !important;
	color: var(--wp--preset--color--taupe, #8c857b) !important;
	line-height: 60px !important;
	max-width: 1005px;
	margin: 0 auto !important;
}

/* Pill mini-nav — the venue's spaces. The active pill (current space) is a
   plain span in a 200×50 mauve-outlined box; siblings are links that swap the
   space bundles via spaces.js. */
.bsw-space-intro__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 9px;
	margin: 31.5px auto 0;
}

.bsw-space-intro__nav-item {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif);
	font-size: 16px;
	line-height: 28px;
	color: #aa747c;
	text-align: center;
	width: 200px;
	flex: 0 0 auto;
	text-decoration: underline;
	text-decoration-color: transparent;
	transition: text-decoration-color 0.2s ease;
}

a.bsw-space-intro__nav-item:hover {
	text-decoration-color: currentColor;
}

.bsw-space-intro__nav-item--active {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 50px;
	box-sizing: border-box;
	border: 1px solid #aa747c;
	color: var(--wp--preset--color--charcoal, #373737);
}

/* Cross-venue link — natural width with the mauve arrow after the label */
.bsw-space-intro__nav-item--external {
	display: inline-flex;
	align-items: center;
	width: auto;
}

.bsw-space-intro__nav-item--external::after {
	content: "";
	width: 16px;
	height: 15px;
	margin-left: 9px;
	flex: 0 0 auto;
	background: url("data:image/svg+xml,%3Csvg width='16' height='15' viewBox='0 0 16 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.15788 0.9926C7.93598 0.764857 7.93598 0.396964 8.15788 0.169221C8.37979 -0.0585227 8.74768 -0.0585227 8.96958 0.169221L15.5449 6.80881C15.7668 7.03656 15.7668 7.40445 15.5449 7.63219L8.96958 14.2718C8.74768 14.4995 8.37979 14.4995 8.15788 14.2718C7.93598 14.044 7.93598 13.6761 8.15788 13.4484L14.1551 7.21758L8.15788 0.9926Z' fill='%23AA747C'/%3E%3Cpath d='M0.583957 6.63959H14.7975C15.1187 6.63959 15.3814 6.90237 15.3814 7.22354C15.3814 7.54472 15.1187 7.8075 14.7975 7.8075H0.583957C0.262781 7.8075 0 7.54472 0 7.22354C0 6.90237 0.262781 6.63959 0.583957 6.63959Z' fill='%23AA747C'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Intro copy */
p.bsw-space-intro__body {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif);
	font-size: 16px;
	line-height: 28px;
	color: var(--wp--preset--color--charcoal, #373737);
	max-width: 944px;
	margin: 31.5px auto 0 !important;
}

/* Space bundles — the per-space content wrappers the mini-nav switches
   between (class lives here because the mini-nav drives it). spaces.js adds
   bsw-spaces-ready on the <html> element; without JS (and in the editor) all
   bundles simply render stacked. */
.bsw-spaces-ready .bsw-space-bundle {
	display: none;
}

.bsw-spaces-ready .bsw-space-bundle.is-active {
	display: block;
}

@media (max-width: 767px) {
	.bsw-space-intro.wp-block-group.alignfull {
		padding: 40px 20px 20px !important;
	}

	h2.bsw-space-intro__title {
		font-size: 46px !important;
		line-height: 46px !important;
	}

	/* Pills wrap into rows; items shrink to their natural width */
	.bsw-space-intro__nav {
		flex-wrap: wrap;
		column-gap: 20px;
		row-gap: 10px;
		margin-top: 27px;
	}

	.bsw-space-intro__nav-item {
		width: auto;
	}

	.bsw-space-intro__nav-item--active {
		width: 190px;
	}

	.bsw-space-intro__nav-item--external::after {
		width: 15px;
		height: 14px;
	}

	p.bsw-space-intro__body {
		margin-top: 20px !important;
	}
}