.rcm-directories-page,
.rcm-directories-page * {
	box-sizing: border-box;
}

.rcm-directories-page {
	width: 100%;
}

.rcm-directories-page__hero-wrap {
	width: min(1278px, calc(100% - 24px));
	margin: 0 auto 22px;
}

.rcm-directories-page__hero-wrap:has(+ .rcm-directories-page__ad-strip--top) {
	margin-bottom: 14px;
}

.rcm-directories-page__hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 283px;
	padding: 20px;
	border-radius: 6px;
	overflow: hidden;
	background-image: var(--rcm-directories-page-hero-background);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.rcm-directories-page__hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(275.68deg, rgba(152, 129, 202, 0) 0.82%, #3e286d 99.63%);
}

.rcm-directories-page__hero-content {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 13px;
	text-align: center;
}

.rcm-directories-page__hero-icon {
	width: 92px;
	height: 92px;
	object-fit: contain;
	flex: 0 0 auto;
}

.rcm-directories-page__hero-title {
	margin: 0;
	color: #ffffff;
	font-family: "Manrope", sans-serif;
	font-size: 28.42px;
	font-weight: 700;
	line-height: 1.45;
}

.rcm-directories-page__featured {
	margin: 0;
}

.rcm-directories-page__sections {
	margin: 0;
}

/* Alternate section backgrounds: start with off-white, then white. */
.rcm-directories-page__sections > .rcm-trending-places {
	background-color: #fbf9f9;
}

.rcm-directories-page__sections > .rcm-trending-places:nth-of-type(even) {
	background-color: #ffffff;
}

/*
 * Elementor page 246 shortcode widget fallback:
 * keep the same off-white -> white rhythm even if wrappers differ.
 */
.elementor.elementor-246 .elementor-element-b5f32c5 .rcm-trending-places:nth-of-type(odd) {
	background-color: #fbf9f9;
}

.elementor.elementor-246 .elementor-element-b5f32c5 .rcm-trending-places:nth-of-type(even) {
	background-color: #ffffff;
}

.rcm-directories-page__ad-strip {
	width: min(920px, calc(100% - 24px));
	min-height: 70px;
	margin: 28px auto;
	border-radius: 6px;
	background: #f2f2f2;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	text-align: center;
}

/* Mobile-only in-feed ad inserted between directories sections. */
.rcm-directories-page__ad-strip--infeed {
	display: none;
}

/* 920×70 leaderboard directly under hero */
.rcm-directories-page__ad-strip--top {
	margin-top: 40px;
	margin-bottom: 24px;
	min-height: 70px;
}

.rcm-directories-page__ad-strip iframe,
.rcm-directories-page__ad-strip img,
.rcm-directories-page__ad-strip ins {
	max-width: 100%;
}

.rcm-directories-page__ad-strip--top iframe,
.rcm-directories-page__ad-strip--top img {
	max-width: min(920px, 100%);
	height: auto;
}

.rcm-directories-page__ad-strip--top iframe {
	max-height: 70px;
}

.rcm-directories-page__ad-placeholder {
	color: #6d6d6d;
	font-family: "Manrope", sans-serif;
	font-size: 28px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.08em;
}

.rcm-directories-page__editors {
	margin: 0;
}

/* Editor's picks on directories page: flow layout from plugin; optional local tweaks */
@media (max-width: 1199px) {
	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__border {
		margin: 4px 0 !important;
	}
}

@media (max-width: 1024px) {
	.rcm-directories-page__hero {
		min-height: 240px;
	}

	.rcm-directories-page__hero-title {
		font-size: 26px;
	}
}

@media (max-width: 767px) {
	.rcm-directories-page__hero-wrap {
		width: calc(100% - 20px);
		margin: 8px auto 16px;
	}

	.rcm-directories-page__hero {
		min-height: 180px;
		padding: 14px;
	}

	.rcm-directories-page__hero-icon {
		width: 68px;
		height: 68px;
	}

	.rcm-directories-page__hero-title {
		font-size: 24px;
		line-height: 1.3;
	}

	.rcm-directories-page__ad-strip {
		width: calc(100% - 20px);
		min-height: 56px;
		margin: 18px auto;
	}

	.rcm-directories-page__ad-placeholder {
		font-size: 22px;
	}
}

/* Directories page: responsive parity with home page rails/cards */
.rcm-directories-page {
	overflow-x: clip;
}

/* Editors section: keep wrapper + inner grid constrained like home and prevent overflow. */
.rcm-directories-page__editors {
	width: 100%;
	margin: 0;
	overflow-x: clip;
}

.rcm-directories-page__editors .rcm-editors-picks {
	width: 100%;
	max-width: 100%;
	overflow-x: clip;
}

.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__container {
	box-sizing: border-box;
	width: 100%;
	max-width: min(1263px, calc(100% - 32px));
	margin-left: auto;
	margin-right: auto;
	row-gap: 0;
}

/* Editors header rhythm for non-Figma desktop breakpoints. */
@media (max-width: 1439px) {
	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__header {
		padding-top: 20px !important;
	}
}

.rcm-directories-page .rcm-editors-picks__title {
	font-family: "Manrope", sans-serif;
}

/* Section lines: keep the same geometry as home across breakpoints. */
.rcm-directories-page .rcm-editors-picks__border.rcm-section-border {
	position: relative;
	display: flex !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 6px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	background-image: none !important;
	background-size: auto !important;
	background-color: transparent !important;
}

.rcm-directories-page .rcm-section-border__accent {
	flex: 0 0 48px !important;
	width: 48px !important;
	min-width: 48px !important;
	max-width: 48px !important;
	height: 6px !important;
}

.rcm-directories-page .rcm-section-border__accent svg {
	display: block !important;
	width: 48px !important;
	height: 6px !important;
}

.rcm-directories-page .rcm-section-border__track {
	flex: 1 1 auto !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	height: 6px !important;
}

.rcm-directories-page .rcm-section-border__track svg {
	display: block !important;
	width: 100% !important;
	height: 6px !important;
}

/* Desktop fidelity for Figma node 1874:2151 (do not affect mobile/tablet). */
@media (min-width: 1440px) {
	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__container {
		width: 1440px !important;
		max-width: 1440px !important;
		min-height: 599px !important;
		padding: 0 !important;
	}

	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__border.rcm-section-border {
		width: 665px !important;
		max-width: 665px !important;
	}

	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__header {
		padding-top: 0 !important;
	}
}

/* Tablet polish: home-like gutters and title -> border -> grid rhythm. */
@media (min-width: 768px) and (max-width: 1199px) {
	.rcm-directories-page {
		--rcm-home-rail-gap-title-rule: 15px;
		--rcm-home-rail-gap-rule-content: 34px;
	}

	.rcm-directories-page__ad-strip {
		width: calc(100% - 40px);
		margin-top: 24px;
		margin-bottom: 24px;
	}

	.rcm-directories-page .rcm-editors-picks {
		padding-top: 40px;
		padding-bottom: 44px;
	}

	.rcm-directories-page .rcm-editors-picks__header {
		margin-bottom: var(--rcm-home-rail-gap-title-rule, 15px) !important;
	}

	.rcm-directories-page .rcm-editors-picks__border {
		margin-bottom: var(--rcm-home-rail-gap-rule-content, 34px) !important;
	}

	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__border {
		margin-top: 0 !important;
	}

	.rcm-directories-page .rcm-editors-picks__border.rcm-section-border {
		max-width: 100% !important;
	}

	.rcm-directories-page .rcm-editors-picks__container {
		width: calc(100% - 40px);
	}

	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__container {
		max-width: calc(100% - 40px);
	}

	.rcm-directories-page__editors .rcm-editors-picks__main {
		gap: 18px;
	}
}

@media (max-width: 767px) {
	.rcm-directories-page {
		--rcm-home-rail-gap-title-rule: 16px;
		--rcm-home-rail-gap-rule-content: 24px;
	}

	.rcm-directories-page__featured,
	.rcm-directories-page__sections,
	.rcm-directories-page__editors {
		width: 100%;
		max-width: none;
		margin-left: 0;
		margin-right: 0;
	}

	.rcm-directories-page .rcm-editors-picks {
		padding-top: 30px;
		padding-bottom: 34px;
	}

	/* Use full-width mobile ad strips with consistent page gutters. */
	.rcm-directories-page__ad-strip {
		width: 100%;
		max-width: none;
		padding-left: 12px;
		padding-right: 12px;
		margin-left: 0;
		margin-right: 0;
	}

	/* When in-feed mid ad exists, hide the standalone mid ad on mobile. */
	.rcm-directories-page--has-infeed-mid .rcm-directories-page__ad-strip--mid {
		display: none;
	}

	.rcm-directories-page__ad-strip--infeed {
		display: flex;
		margin-top: 24px;
		margin-bottom: 24px;
	}

	.rcm-directories-page .rcm-editors-picks__container {
		width: 100%;
		max-width: none;
		padding-left: 12px;
		padding-right: 12px;
		margin-left: 0;
		margin-right: 0;
	}

	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__container {
		width: 100% !important;
		max-width: none;
		padding-inline: 12px !important;
		row-gap: 0 !important;
	}

	.rcm-directories-page .rcm-editors-picks__header {
		margin-bottom: var(--rcm-home-rail-gap-title-rule, 16px) !important;
	}

	.rcm-directories-page .rcm-editors-picks__border {
		margin-bottom: var(--rcm-home-rail-gap-rule-content, 24px) !important;
	}

	/* Override shared mobile rule that stretches accent/track by percentage. */
	.rcm-directories-page .rcm-section-border {
		height: 6px !important;
	}

	.rcm-directories-page .rcm-section-border__accent {
		flex: 0 0 48px !important;
		width: 48px !important;
		min-width: 48px !important;
		max-width: 48px !important;
		height: 6px !important;
	}

	.rcm-directories-page .rcm-section-border__track {
		flex: 1 1 auto !important;
		width: auto !important;
		height: 6px !important;
	}

	/* Mobile structure polish for Editors picks. */
	.rcm-directories-page__editors .rcm-editors-picks__main {
		gap: 14px;
	}

	.rcm-directories-page__editors .rcm-editors-picks__header {
		margin-bottom: var(--rcm-home-rail-gap-title-rule, 16px) !important;
	}

	.rcm-directories-page__editors .rcm-editors-picks__border.rcm-section-border {
		margin-bottom: var(--rcm-home-rail-gap-rule-content, 24px) !important;
	}

	.rcm-directories-page__editors .rcm-editors-picks__story {
		grid-template-columns: 1fr;
		gap: 10px;
		align-items: start;
	}

	.rcm-directories-page__editors .rcm-editors-picks__image {
		max-width: none;
		width: 100%;
		aspect-ratio: 16 / 9;
	}

	.rcm-directories-page__editors .rcm-editors-picks__story-copy {
		gap: 6px;
	}

	.rcm-directories-page__editors .rcm-editors-picks__item-title {
		font-size: 21px;
		line-height: 1.28;
	}

	.rcm-directories-page__editors .rcm-editors-picks__rail {
		display: none !important;
	}

}

/* Final mobile alignment pass:
 * keep /directories spacing/gutters identical to home-section rhythm.
 * Also include a page-id fallback when the wrapper shortcode is not present.
 */
@media (max-width: 767px) {
	.rcm-directories-page {
		--rcm-page-mobile-gutter: 12px;
	}

	.rcm-directories-page__hero-wrap,
	.rcm-directories-page__ad-strip,
	.rcm-directories-page .rcm-editors-picks__container {
		width: min(100%, calc(100% - (var(--rcm-page-mobile-gutter) * 2))) !important;
		max-width: none !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.rcm-directories-page__editors .rcm-editors-picks .rcm-editors-picks__container {
		width: min(100%, calc(100% - (var(--rcm-page-mobile-gutter) * 2))) !important;
		max-width: none !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-inline: 0 !important;
	}

	/* Fallback for /directories (246) or Guides (270) when wrapper shortcode layout matches directories rhythm. */
	body.page-id-246,
	body.page-id-270 {
		--rcm-page-mobile-gutter: 12px;
		--rcm-home-rail-gap-title-rule: 16px;
		--rcm-home-rail-gap-rule-content: 24px;
	}

	body.page-id-246 .rcm-editors-picks,
	body.page-id-270 .rcm-editors-picks {
		padding-top: 30px;
		padding-bottom: 34px;
	}

	body.page-id-246 .rcm-editors-picks__container,
	body.page-id-270 .rcm-editors-picks__container {
		width: min(100%, calc(100% - (var(--rcm-page-mobile-gutter) * 2))) !important;
		max-width: none !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body.page-id-246 .rcm-editors-picks__header,
	body.page-id-270 .rcm-editors-picks__header {
		margin-bottom: var(--rcm-home-rail-gap-title-rule, 16px) !important;
	}

	body.page-id-246 .rcm-editors-picks__border,
	body.page-id-270 .rcm-editors-picks__border {
		margin-bottom: var(--rcm-home-rail-gap-rule-content, 24px) !important;
	}

	/*
	 * Directories (246) / Guides (270): WPBakery + Elementor boxed columns add horizontal padding
	 * while shortcodes also shrink width — double gutter, rails visually “off”.
	 */
	body.page-id-246 .wpb-content-wrapper,
	body.page-id-270 .wpb-content-wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		max-width: none !important;
	}

	.elementor.elementor-246 .e-con:has(.rcm-directories-page) > .e-con-inner {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.elementor.elementor-246 .elementor-widget:has(.rcm-directories-page) > .elementor-widget-container {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.elementor.elementor-270 .e-con:has(.rcm-explore-places) > .e-con-inner,
	.elementor.elementor-270 .e-con:has(.rcm-trending-places) > .e-con-inner,
	.elementor.elementor-270 .e-con:has(.rcm-latest-guides) > .e-con-inner,
	.elementor.elementor-270 .e-con:has(.rcm-editors-picks) > .e-con-inner {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.elementor.elementor-270 .elementor-widget:has(.rcm-explore-places) > .elementor-widget-container,
	.elementor.elementor-270 .elementor-widget:has(.rcm-trending-places) > .elementor-widget-container,
	.elementor.elementor-270 .elementor-widget:has(.rcm-latest-guides) > .elementor-widget-container,
	.elementor.elementor-270 .elementor-widget:has(.rcm-editors-picks) > .elementor-widget-container {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* shortcodes-extended mobile % accent reads as a fat purple bar; lock 48px + track like desktop. */
	body.page-id-246 .rcm-directories-page .rcm-section-border,
	body.page-id-246 .rcm-explore-places__border.rcm-section-border,
	body.page-id-246 .rcm-trending-places__border.rcm-section-border,
	body.page-id-270 .rcm-explore-places__border.rcm-section-border,
	body.page-id-270 .rcm-trending-places__border.rcm-section-border,
	body.page-id-270 .rcm-latest-guides__border.rcm-section-border {
		height: 6px !important;
		align-items: stretch !important;
	}

	body.page-id-246 .rcm-directories-page .rcm-section-border__accent,
	body.page-id-246 .rcm-explore-places__border.rcm-section-border .rcm-section-border__accent,
	body.page-id-246 .rcm-trending-places__border.rcm-section-border .rcm-section-border__accent,
	body.page-id-270 .rcm-explore-places__border.rcm-section-border .rcm-section-border__accent,
	body.page-id-270 .rcm-trending-places__border.rcm-section-border .rcm-section-border__accent,
	body.page-id-270 .rcm-latest-guides__border.rcm-section-border .rcm-section-border__accent {
		flex: 0 0 48px !important;
		width: 48px !important;
		min-width: 48px !important;
		max-width: 48px !important;
		height: 6px !important;
	}

	body.page-id-246 .rcm-directories-page .rcm-section-border__accent svg,
	body.page-id-246 .rcm-explore-places__border.rcm-section-border .rcm-section-border__accent svg,
	body.page-id-246 .rcm-trending-places__border.rcm-section-border .rcm-section-border__accent svg,
	body.page-id-270 .rcm-explore-places__border.rcm-section-border .rcm-section-border__accent svg,
	body.page-id-270 .rcm-trending-places__border.rcm-section-border .rcm-section-border__accent svg,
	body.page-id-270 .rcm-latest-guides__border.rcm-section-border .rcm-section-border__accent svg {
		display: block !important;
		width: 48px !important;
		height: 6px !important;
	}

	body.page-id-246 .rcm-directories-page .rcm-section-border__track,
	body.page-id-246 .rcm-explore-places__border.rcm-section-border .rcm-section-border__track,
	body.page-id-246 .rcm-trending-places__border.rcm-section-border .rcm-section-border__track,
	body.page-id-270 .rcm-explore-places__border.rcm-section-border .rcm-section-border__track,
	body.page-id-270 .rcm-trending-places__border.rcm-section-border .rcm-section-border__track,
	body.page-id-270 .rcm-latest-guides__border.rcm-section-border .rcm-section-border__track {
		flex: 1 1 auto !important;
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
		height: 6px !important;
	}

	body.page-id-246 .rcm-directories-page .rcm-section-border__track svg,
	body.page-id-246 .rcm-explore-places__border.rcm-section-border .rcm-section-border__track svg,
	body.page-id-246 .rcm-trending-places__border.rcm-section-border .rcm-section-border__track svg,
	body.page-id-270 .rcm-explore-places__border.rcm-section-border .rcm-section-border__track svg,
	body.page-id-270 .rcm-trending-places__border.rcm-section-border .rcm-section-border__track svg,
	body.page-id-270 .rcm-latest-guides__border.rcm-section-border .rcm-section-border__track svg {
		width: 100% !important;
		height: 6px !important;
	}
}

/* Inherit empty state styles from home-sections shortcode (loaded globally) */
.rcm-trending-places__empty {
	grid-column: 1 / -1;
	width: 100%;
	max-width: none;
}

.rcm-trending-places__empty .rcm-home-section-empty {
	max-width: none;
}

.rcm-trending-places.rcm-trending-places--no-topics {
	box-sizing: border-box;
	width: min(1263px, calc(100% - 32px));
	margin-left: auto;
	margin-right: auto;
	padding: 24px 0 32px;
}
