/*
 * Mike Reizen Full Width Blog Search
 * Full-width search page with a 1400px results container.
 */

body.mrbs-search-results-active {
	overflow-x: hidden !important;
}


/*
 * Astra adds margin: 4em 0 to #primary on desktop.
 * Remove it only on this plugin's search-results page.
 */
@media (min-width: 993px) {
	body.mrbs-search-results-active.ast-separate-container #primary.mrbs-search-page,
	body.mrbs-search-results-active.ast-separate-container.ast-left-sidebar #primary.mrbs-search-page,
	body.mrbs-search-results-active.ast-separate-container.ast-right-sidebar #primary.mrbs-search-page,
	body.mrbs-search-results-active #content #primary.mrbs-search-page,
	body.mrbs-search-results-active .site-content #primary.mrbs-search-page {
		margin-top: 0 !important;
		margin-right: -50vw !important;
		margin-bottom: 0 !important;
		margin-left: -50vw !important;
		padding: 0 !important;
	}
}

/* Also neutralize any Astra container spacing around the custom search template. */
body.mrbs-search-results-active #content,
body.mrbs-search-results-active .site-content,
body.mrbs-search-results-active #content > .ast-container,
body.mrbs-search-results-active .site-content > .ast-container {
	margin-top: 0 !important;
	padding-top: 0 !important;
}


body.mrbs-search-results-active .mrbs-search-page,
body.mrbs-search-results-active .mrbs-search-page * {
	box-sizing: border-box;
}

.mrbs-search-page {
	position: relative !important;
	left: 50% !important;
	right: 50% !important;
	display: block !important;
	width: 100vw !important;
	max-width: none !important;
	min-height: 70vh !important;
	margin-right: -50vw !important;
	margin-left: -50vw !important;
	padding: 0 !important;
	overflow: hidden !important;
	background: #ffffff !important;
}


/* Place the Astra/WordPress header transparently on top of the banner. */
body.mrbs-search-results-active #masthead,
body.mrbs-search-results-active header#masthead,
body.mrbs-search-results-active .site-header {
	position: absolute !important;
	z-index: 999 !important;
	top: 0 !important;
	right: 0 !important;
	left: 0 !important;
	width: 100% !important;
	margin: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

body.mrbs-search-results-active #masthead .ast-primary-header-bar,
body.mrbs-search-results-active #masthead .main-header-bar,
body.mrbs-search-results-active #masthead .site-primary-header-wrap,
body.mrbs-search-results-active #masthead .ast-builder-grid-row-container,
body.mrbs-search-results-active #masthead .ast-builder-grid-row-container-inner,
body.mrbs-search-results-active #masthead .ast-container,
body.mrbs-search-results-active #masthead .elementor-section,
body.mrbs-search-results-active #masthead .elementor-container {
	background: transparent !important;
	box-shadow: none !important;
}

body.mrbs-search-results-active #content,
body.mrbs-search-results-active .site-content {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

/* Keep header links and logo visible over the photograph. */
body.mrbs-search-results-active #masthead a,
body.mrbs-search-results-active #masthead .menu-link,
body.mrbs-search-results-active #masthead .ast-menu-toggle,
body.mrbs-search-results-active #masthead .site-title a {
	color: #ffffff !important;
}

body.mrbs-search-results-active #masthead svg {
	fill: currentColor;
	color: #ffffff !important;
}


/* Full-width banner */
.mrbs-search-hero {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 460px !important;
	margin: 0 !important;
	padding: 210px 24px 110px !important;
	overflow: hidden !important;
	background-image: var(--mrbs-banner-image) !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: cover !important;
	isolation: isolate;
}

.mrbs-search-hero-overlay {
	position: absolute !important;
	z-index: 0 !important;
	inset: 0 !important;
	background:
		linear-gradient(
			180deg,
			rgba(0, 0, 0, .20) 0%,
			rgba(0, 0, 0, .28) 42%,
			rgba(0, 0, 0, .48) 100%
		) !important;
}

.mrbs-search-hero-inner {
	position: relative !important;
	z-index: 1 !important;
	width: min(1400px, 100%) !important;
	margin: 0 auto !important;
	text-align: center !important;
}

.mrbs-search-kicker {
	margin: 0 0 11px !important;
	padding: 0 !important;
	color: #f1c1ae !important;
	font-family: Georgia, "Times New Roman", serif !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
	letter-spacing: .03em !important;
	text-transform: uppercase !important;
	text-shadow: 0 2px 15px rgba(0, 0, 0, .38);
}

.mrbs-search-title {
	max-width: 1200px !important;
	margin: 0 auto !important;
	padding: 0 !important;
	color: #ffffff !important;
	font-family: Georgia, "Times New Roman", serif !important;
	font-size: clamp(48px, 6vw, 82px) !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	letter-spacing: -.045em !important;
	text-align: center !important;
	text-transform: uppercase !important;
	text-shadow: 0 4px 24px rgba(0, 0, 0, .45);
	overflow-wrap: anywhere;
}

/* Full-width white results area */
.mrbs-results-section {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 84px 24px 110px !important;
	background: #ffffff !important;
}

.mrbs-results-container {
	display: block !important;
	width: min(1400px, 100%) !important;
	max-width: 1400px !important;
	height: auto !important;
	margin: 0 auto !important;
	padding: 0 !important;
	overflow: visible !important;
}

/* Exact card behavior based on the supplied Travel Blog Grid Flow styling */
.mrbs-grid {
	--mrbs-gap: 22px;
	--mrbs-radius: 9px;
	--mrbs-accent: #cf704f;
	position: relative !important;
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	grid-auto-rows: auto !important;
	grid-auto-flow: row !important;
	align-items: stretch !important;
	gap: var(--mrbs-gap) !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
}

.mrbs-card {
	position: relative !important;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	grid-template-rows: auto !important;
	width: 100% !important;
	height: auto !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: var(--mrbs-radius) !important;
	background: #1d2421 !important;
	color: #ffffff !important;
	text-decoration: none !important;
	box-shadow: none !important;
	isolation: isolate;
}

.mrbs-media,
.mrbs-shade,
.mrbs-categories,
.mrbs-card-content {
	grid-column: 1 !important;
	grid-row: 1 !important;
}

.mrbs-media {
	position: relative !important;
	z-index: 0 !important;
	display: block !important;
	align-self: stretch !important;
	width: 100% !important;
	min-width: 0 !important;
	aspect-ratio: .78 / 1 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	background: linear-gradient(145deg, #53635a, #202723) !important;
}

.mrbs-image {
	position: absolute !important;
	inset: 0 !important;
	z-index: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	object-fit: cover !important;
	object-position: center !important;
	transform: scale(1.001);
	transition: transform .8s cubic-bezier(.2, .7, .2, 1), filter .45s ease;
	will-change: transform;
}

.mrbs-shade {
	position: relative !important;
	z-index: 1 !important;
	align-self: stretch !important;
	justify-self: stretch !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 100% !important;
	pointer-events: none;
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, .02) 0%,
		rgba(0, 0, 0, .02) 42%,
		rgba(0, 0, 0, .16) 64%,
		rgba(0, 0, 0, .72) 100%
	) !important;
	transition: background .45s ease;
}

.mrbs-card:hover .mrbs-image,
.mrbs-card:focus-visible .mrbs-image {
	transform: scale(1.085);
	filter: saturate(1.04);
}

.mrbs-card:hover .mrbs-shade,
.mrbs-card:focus-visible .mrbs-shade {
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, .04) 0%,
		rgba(0, 0, 0, .05) 38%,
		rgba(0, 0, 0, .22) 61%,
		rgba(0, 0, 0, .80) 100%
	) !important;
}

.mrbs-categories {
	position: relative !important;
	z-index: 4 !important;
	align-self: start !important;
	justify-self: stretch !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	width: auto !important;
	min-width: 0 !important;
	margin: 30px 24px 0 30px !important;
	padding: 0 !important;
	pointer-events: none;
}

.mrbs-category {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	max-width: 100% !important;
	min-height: 40px !important;
	margin: 0 !important;
	padding: 10px 18px !important;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, .32) !important;
	border-radius: 999px !important;
	background: rgba(255, 255, 255, .74) !important;
	box-shadow: none !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	color: var(--mrbs-accent) !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mrbs-card-content {
	position: relative !important;
	z-index: 3 !important;
	align-self: end !important;
	justify-self: stretch !important;
	display: block !important;
	width: auto !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 28px 28px !important;
	transform: translate3d(0, 34px, 0);
	transition: transform .5s cubic-bezier(.22, .61, .36, 1);
}

.mrbs-card-title {
	display: -webkit-box !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: #ffffff !important;
	font-family: inherit !important;
	font-size: clamp(20px, 1.5vw, 30px) !important;
	font-weight: 600 !important;
	line-height: 1.22 !important;
	letter-spacing: -.025em !important;
	text-align: left !important;
	text-transform: none !important;
	text-shadow: 0 2px 14px rgba(0, 0, 0, .28);
}

.mrbs-card-cta {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	width: auto !important;
	max-width: 100% !important;
	max-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	background: transparent !important;
	color: #ffffff !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	text-decoration: none !important;
	opacity: 0;
	visibility: hidden;
	transform: translate3d(0, 14px, 0);
	transition:
		opacity .32s ease,
		visibility .32s ease,
		transform .45s cubic-bezier(.22, .61, .36, 1),
		max-height .45s ease,
		margin-top .45s ease;
}

.mrbs-card-cta::after {
	content: "\2192";
	display: inline-block;
	font-size: 22px;
	line-height: 1;
	transition: transform .28s ease;
}

.mrbs-card:hover .mrbs-card-content,
.mrbs-card:focus-visible .mrbs-card-content {
	transform: translate3d(0, 0, 0);
}

.mrbs-card:hover .mrbs-card-cta,
.mrbs-card:focus-visible .mrbs-card-cta {
	max-height: 36px !important;
	margin-top: 18px !important;
	opacity: 1;
	visibility: visible;
	transform: translate3d(0, 0, 0);
}

.mrbs-card:hover .mrbs-card-cta::after,
.mrbs-card:focus-visible .mrbs-card-cta::after {
	transform: translateX(5px);
}

/* Pagination */
.mrbs-pagination {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-wrap: wrap !important;
	clear: both !important;
	gap: 8px !important;
	width: 100% !important;
	height: auto !important;
	margin: 42px 0 0 !important;
	padding: 0 !important;
}

.mrbs-pagination .page-numbers {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 42px !important;
	height: 42px !important;
	margin: 0 !important;
	padding: 0 13px !important;
	border: 1px solid #e4e4e4 !important;
	border-radius: 999px !important;
	background: #ffffff !important;
	color: #222222 !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	box-shadow: none !important;
	transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease;
}

.mrbs-pagination a.page-numbers:hover,
.mrbs-pagination a.page-numbers:focus-visible {
	border-color: #cf704f !important;
	color: #cf704f !important;
	transform: translateY(-1px);
}

.mrbs-pagination .page-numbers.current {
	border-color: #cf704f !important;
	background: #cf704f !important;
	color: #ffffff !important;
}

.mrbs-pagination .page-numbers.dots {
	min-width: 24px !important;
	padding: 0 !important;
	border-color: transparent !important;
	background: transparent !important;
}

/* Search form shortcode */
.mrbs-search-form {
	display: flex !important;
	width: min(680px, 100%) !important;
	min-height: 54px !important;
	margin: 0 auto !important;
	overflow: hidden !important;
	border: 1px solid #d7d7d7 !important;
	border-radius: 2px !important;
	background: #ffffff !important;
}

.mrbs-search-input {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	height: 54px !important;
	margin: 0 !important;
	padding: 0 18px !important;
	border: 0 !important;
	outline: 0 !important;
	background: transparent !important;
	color: #292929 !important;
	box-shadow: none !important;
	font-size: 16px !important;
}

.mrbs-search-button {
	display: inline-flex !important;
	flex: 0 0 auto !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 9px !important;
	min-width: 128px !important;
	margin: 0 !important;
	padding: 0 20px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: #292929 !important;
	color: #ffffff !important;
	cursor: pointer !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}

.mrbs-search-button svg {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.mrbs-empty {
	width: min(760px, 100%) !important;
	margin: 0 auto !important;
	padding: 52px 30px !important;
	text-align: center !important;
	border: 1px solid #ececec !important;
	background: #fafafa !important;
}

.mrbs-empty h2 {
	margin: 0 0 10px !important;
	color: #282828 !important;
	font-size: 30px !important;
}

.mrbs-empty p {
	margin: 0 0 28px !important;
	color: #666666 !important;
	font-size: 16px !important;
}

@media (max-width: 1024px) {
	.mrbs-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.mrbs-card-title {
		font-size: clamp(22px, 3vw, 30px) !important;
	}
}

@media (max-width: 767px) {
	.mrbs-search-hero {
		min-height: 360px !important;
		padding: 155px 18px 75px !important;
	}

	.mrbs-search-title {
		font-size: clamp(40px, 12vw, 58px) !important;
	}

	.mrbs-results-section {
		padding: 55px 14px 75px !important;
	}

	.mrbs-grid {
		--mrbs-gap: 14px;
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.mrbs-categories {
		margin: 20px 20px 0 !important;
	}

	.mrbs-category {
		min-height: 36px !important;
		padding: 8px 14px !important;
		font-size: 14px !important;
	}

	.mrbs-card-content {
		padding: 0 22px 24px !important;
	}

	.mrbs-card-title {
		font-size: 23px !important;
	}

	.mrbs-search-form {
		flex-direction: column !important;
		border: 0 !important;
		background: transparent !important;
		gap: 10px !important;
	}

	.mrbs-search-input {
		width: 100% !important;
		border: 1px solid #d7d7d7 !important;
		background: #ffffff !important;
	}

	.mrbs-search-button {
		width: 100% !important;
		min-height: 52px !important;
	}
}

@media (hover: none) {
	.mrbs-card-content {
		transform: translate3d(0, 0, 0);
	}

	.mrbs-card-cta {
		max-height: 36px !important;
		margin-top: 18px !important;
		opacity: 1;
		visibility: visible;
		transform: translate3d(0, 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.mrbs-image,
	.mrbs-shade,
	.mrbs-card-content,
	.mrbs-card-cta,
	.mrbs-card-cta::after {
		transition: none !important;
	}
}


/* -------------------------------------------------------------------------
 * v2.3 — Modern expanding header search
 * Only the shortcode search control is changed. The banner, cards and page
 * layout remain untouched.
 * ------------------------------------------------------------------------- */

.mrbs-search-form {
	position: relative !important;
	display: block !important;
	width: 50px !important;
	min-width: 50px !important;
	max-width: none !important;
	height: 50px !important;
	min-height: 50px !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	isolation: isolate;
}

.mrbs-search-input {
	position: absolute !important;
	z-index: 1 !important;
	top: 50% !important;
	right: 62px !important;
	display: block !important;
	width: 0 !important;
	min-width: 0 !important;
	max-width: min(360px, calc(100vw - 115px)) !important;
	height: 50px !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 1px solid rgba(255, 255, 255, .72) !important;
	border-radius: 999px !important;
	outline: 0 !important;
	background: rgba(255, 255, 255, .96) !important;
	color: #202020 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	box-shadow: 0 12px 34px rgba(0, 0, 0, .18) !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: 50px !important;
	opacity: 0 !important;
	pointer-events: none !important;
	transform: translate3d(18px, -50%, 0) scaleX(.92) !important;
	transform-origin: right center !important;
	transition:
		width .42s cubic-bezier(.22, .61, .36, 1),
		padding .42s cubic-bezier(.22, .61, .36, 1),
		opacity .22s ease,
		transform .42s cubic-bezier(.22, .61, .36, 1),
		box-shadow .25s ease !important;
}

.mrbs-search-input::placeholder {
	color: #8b93a1 !important;
	opacity: 1 !important;
}

.mrbs-search-form.is-open .mrbs-search-input {
	width: min(360px, calc(100vw - 115px)) !important;
	padding: 0 22px !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	transform: translate3d(0, -50%, 0) scaleX(1) !important;
}

.mrbs-search-form.is-open .mrbs-search-input:focus {
	border-color: #ffffff !important;
	box-shadow:
		0 14px 38px rgba(0, 0, 0, .22),
		0 0 0 3px rgba(255, 255, 255, .18) !important;
}

.mrbs-search-button {
	position: relative !important;
	z-index: 2 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 50px !important;
	min-width: 50px !important;
	max-width: 50px !important;
	height: 50px !important;
	min-height: 50px !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible !important;
	border: 0 !important;
	border-radius: 50% !important;
	outline: 0 !important;
	background: transparent !important;
	color: #ffffff !important;
	cursor: pointer !important;
	box-shadow: none !important;
	transition:
		background-color .25s ease,
		transform .25s ease,
		box-shadow .25s ease !important;
}

.mrbs-search-button:hover,
.mrbs-search-button:focus-visible,
.mrbs-search-form.is-open .mrbs-search-button {
	background: rgba(0, 0, 0, .16) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .12) !important;
	transform: translateY(-1px);
}

.mrbs-search-button:focus-visible {
	outline: 2px solid rgba(255, 255, 255, .95) !important;
	outline-offset: 3px !important;
}

.mrbs-search-button svg {
	display: block !important;
	width: 27px !important;
	height: 27px !important;
	margin: 0 !important;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2.35 !important;
	color: #ffffff !important;
	filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .22));
}

.mrbs-search-button-label {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	border: 0 !important;
	white-space: nowrap !important;
}

/* Allow the animated field to extend left outside Elementor's shortcode box. */
.elementor-widget-shortcode:has(.mrbs-search-form),
.elementor-widget-shortcode:has(.mrbs-search-form) > .elementor-widget-container,
.elementor-widget-html:has(.mrbs-search-form),
.elementor-widget-html:has(.mrbs-search-form) > .elementor-widget-container {
	overflow: visible !important;
}

/* In the no-results message, keep the same control but use a dark icon because
 * that area has a light background. This does not affect the header version.
 */
.mrbs-empty .mrbs-search-button {
	background: #202020 !important;
	color: #ffffff !important;
}

@media (max-width: 767px) {
	.mrbs-search-form {
		display: block !important;
		flex-direction: initial !important;
		width: 46px !important;
		min-width: 46px !important;
		height: 46px !important;
		min-height: 46px !important;
		gap: 0 !important;
		border: 0 !important;
		background: transparent !important;
	}

	.mrbs-search-button {
		width: 46px !important;
		min-width: 46px !important;
		max-width: 46px !important;
		height: 46px !important;
		min-height: 46px !important;
	}

	.mrbs-search-button svg {
		width: 24px !important;
		height: 24px !important;
	}

	.mrbs-search-input {
		right: 56px !important;
		width: 0 !important;
		max-width: calc(100vw - 88px) !important;
		height: 46px !important;
		line-height: 46px !important;
		font-size: 15px !important;
	}

	.mrbs-search-form.is-open .mrbs-search-input {
		width: min(290px, calc(100vw - 88px)) !important;
		padding: 0 18px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mrbs-search-input,
	.mrbs-search-button {
		transition: none !important;
	}
}