/*
 * BeatPoint visual fixes.
 * Keeps the generated WordPress page intact while correcting contrast and mobile layout.
 */

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

body {
	background: #000;
}

body,
.wp-site-blocks,
.entry-content {
	color: #111;
}

/* Dark sections: force readable white text. */
#bp-fixed-header,
#bp-fixed-header a,
#bp-fixed-header button,
.bp-landing-fullscreen,
.bp-landing-fullscreen a,
.bp-landing-fullscreen p,
.bp-landing-fullscreen h1,
.bp-landing-fullscreen h2,
.bp-landing-fullscreen h3,
.has-contrast-background-color,
.has-contrast-background-color a,
.has-contrast-background-color p,
.has-contrast-background-color h1,
.has-contrast-background-color h2,
.has-contrast-background-color h3,
.has-contrast-background-color h4,
.has-contrast-background-color h5,
.has-contrast-background-color h6,
.has-black-background-color,
.has-black-background-color a,
.has-black-background-color p,
.has-black-background-color h1,
.has-black-background-color h2,
.has-black-background-color h3,
.has-black-background-color h4,
.has-black-background-color h5,
.has-black-background-color h6,
footer.wp-block-template-part,
footer.wp-block-template-part a,
footer.wp-block-template-part p,
footer.wp-block-template-part h1,
footer.wp-block-template-part h2,
footer.wp-block-template-part h3,
footer.wp-block-template-part h4,
footer.wp-block-template-part h5,
footer.wp-block-template-part h6 {
	color: #fff !important;
}

/* Light sections: force readable dark text. */
.has-base-background-color,
.has-base-background-color a,
.has-base-background-color p,
.has-base-background-color h1,
.has-base-background-color h2,
.has-base-background-color h3,
.has-base-background-color h4,
.has-base-background-color h5,
.has-base-background-color h6,
.has-white-background-color,
.has-white-background-color a,
.has-white-background-color p,
.has-white-background-color h1,
.has-white-background-color h2,
.has-white-background-color h3,
.has-white-background-color h4,
.has-white-background-color h5,
.has-white-background-color h6 {
	color: #111 !important;
}

/* Header changes state from black to white after entering the page. */
#bp-fixed-header {
	background-color: #000 !important;
}

#bp-fixed-header.bp-active,
#bp-fixed-header.bp-scrolled {
	background-color: #fff !important;
}

#bp-fixed-header.bp-active,
#bp-fixed-header.bp-active a,
#bp-fixed-header.bp-active #bp-logo-text,
#bp-fixed-header.bp-active .bp-nav-item,
#bp-fixed-header.bp-scrolled,
#bp-fixed-header.bp-scrolled a,
#bp-fixed-header.bp-scrolled #bp-logo-text,
#bp-fixed-header.bp-scrolled .bp-nav-item {
	color: #111 !important;
}

/* Buttons and button-like links. */
#bp-start-btn,
.wp-element-button,
.wp-block-button__link {
	background-color: #111 !important;
	color: #fff !important;
	border-color: #111 !important;
	text-decoration: none !important;
}

#bp-start-btn:hover,
.wp-element-button:hover,
.wp-block-button__link:hover {
	background-color: #000 !important;
	color: #fff !important;
}

.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button__link.is-style-outline,
.has-base-background-color .wp-block-button__link,
.has-white-background-color .wp-block-button__link {
	color: #fff !important;
}

.has-contrast-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-black-background-color .wp-block-button.is-style-outline > .wp-block-button__link {
	background-color: #fff !important;
	color: #111 !important;
	border-color: #fff !important;
}

/* Media and embeds should never push the page wider than the viewport. */
img,
video,
iframe,
canvas,
svg,
.map-container,
.wp-block-image,
.wp-block-image img,
.wp-block-embed,
.wp-block-embed__wrapper {
	max-width: 100% !important;
	box-sizing: border-box;
}

.map-container iframe {
	display: block;
	width: 100% !important;
}

.bp-intro-text {
	max-width: min(980px, calc(100vw - 32px));
	margin-left: auto !important;
	margin-right: auto !important;
	color: #fff !important;
	line-height: 1.35 !important;
}

#bp-start-wrapper {
	max-width: calc(100vw - 32px);
	margin-left: auto !important;
	margin-right: auto !important;
}

#bp-start-btn {
	max-width: 100%;
	white-space: normal;
	line-height: 1.2;
}

@media (max-width: 781px) {
	body {
		font-size: 16px !important;
		line-height: 1.5 !important;
		--wp--style--root--padding-right: 18px !important;
		--wp--style--root--padding-left: 18px !important;
	}

	.wp-site-blocks,
	.entry-content,
	.has-global-padding,
	.wp-block-group,
	.wp-block-post-content,
	.wp-block-template-part,
	.bp-revealed-content {
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	.wp-block-group,
	.wp-block-post-content,
	.galeria-beatpoint,
	.bp-hidden-gallery,
	.bp-revealed-content > .wp-block-group,
	.wp-block-template-part > .wp-block-group {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}

	.bp-landing-fullscreen {
		min-height: 100svh !important;
		height: auto !important;
		padding-left: 18px !important;
		padding-right: 18px !important;
	}

	.bp-intro-text {
		font-size: clamp(1.05rem, 4.7vw, 1.45rem) !important;
		padding-top: clamp(72px, 18vw, 112px) !important;
		padding-bottom: clamp(32px, 10vw, 64px) !important;
		overflow-wrap: anywhere;
	}

	#bp-start-btn {
		width: min(100%, 340px);
		padding: 16px 22px !important;
		font-size: 14px !important;
		letter-spacing: 1.4px !important;
		border-radius: 10px !important;
	}

	#bp-fixed-header {
		height: auto !important;
		min-height: 58px !important;
		padding: 10px 0 !important;
	}

	#bp-header-container {
		flex-wrap: wrap !important;
		gap: 8px 12px !important;
		padding-left: 14px !important;
		padding-right: 14px !important;
		box-sizing: border-box !important;
	}

	#bp-logo-text,
	.bp-nav-item {
		font-size: 14px !important;
		line-height: 1.25 !important;
	}

	#bp-header-container ul {
		flex-wrap: wrap !important;
		gap: 8px 12px !important;
		justify-content: flex-end !important;
	}

	.wp-block-columns,
	.wp-block-columns.is-layout-flex,
	.wp-block-columns.is-not-stacked-on-mobile {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 24px !important;
	}

	.wp-block-columns > .wp-block-column,
	.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column,
	.wp-block-column[style*="flex-basis"] {
		flex-basis: 100% !important;
		flex-grow: 1 !important;
		min-width: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.wp-block-column,
	.wp-block-column > * {
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	.wp-block-image,
	.wp-block-image figure {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.wp-block-image img {
		height: auto !important;
		border-radius: min(28px, 8vw) !important;
	}

	.map-container {
		height: 320px !important;
		border-radius: 12px !important;
	}

	footer.wp-block-template-part .wp-block-group,
	footer.wp-block-template-part .is-layout-flex,
	footer.wp-block-template-part .is-nowrap {
		flex-wrap: wrap !important;
		justify-content: center !important;
		text-align: center !important;
		gap: 14px !important;
	}
}

@media (max-width: 430px) {
	.wp-block-group,
	.wp-block-post-content,
	.galeria-beatpoint,
	.bp-hidden-gallery,
	.bp-revealed-content > .wp-block-group {
		padding-left: 14px !important;
		padding-right: 14px !important;
	}

	#bp-header-container {
		justify-content: center !important;
	}

	#bp-header-container ul {
		width: 100%;
		justify-content: center !important;
	}

	.bp-intro-text {
		max-width: calc(100vw - 28px);
		font-size: clamp(1rem, 5vw, 1.25rem) !important;
	}
}