/*
 * Bekaa luxe body
 * White Desert-style tiny body treatment for hero-section paragraph copy
 * inside [mk_fancy_title] / [mk_page_section] shortcodes.
 *
 * Currently scoped to homepage via `body.bekaa-home-wd-transition-page`.
 * To enable sitewide:
 *   1. Replace `body.bekaa-home-wd-transition-page` with `body` (or just drop it)
 *   2. Or leave the file as-is and add the body class via body_class filter to
 *      whichever pages should opt in.
 *
 * To revert entirely: dequeue this stylesheet (or delete it). No DB writes,
 * no shortcode edits — original Jupiter inline styles take over again.
 *
 * Selector strategy:
 *   `span.mk-fancy-title:has(p)` matches the body-copy fancy-title wrappers
 *   (which render with tag_name="span" and contain a <p>) and excludes the
 *   heading wrappers (which contain h1-h6). The auto-generated per-instance
 *   `<style id="mk-shortcode-style-XYZ">` blocks set font-size via an
 *   ID selector, so `!important` is required to win.
 */

body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) {
	font-family: var(--bekaa-system-font, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 1.55 !important;
	letter-spacing: 0.005em !important;
	color: rgba(255, 255, 255, 0.9) !important;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.35);
}

body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) p,
body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) > span {
	color: inherit !important;
	text-shadow: inherit;
}

/*
 * Hero red-divider line — hidden site-wide.
 * White Desert-style sections use whitespace, not dividers, between heading
 * and body. The brand-red full stop on the heading already carries the
 * accent. Remove with CSS only so the [mk_divider] shortcode stays in
 * WPBakery untouched — restoring is a one-line CSS revert.
 *
 * Use visibility:hidden + reduced height (rather than display:none) so the
 * shortcode's margin_bottom continues to provide heading-to-body breathing
 * room. Keeps the layout rhythm without the visible red line.
 *
 * Scope deliberately not page-bound: this is a deprecated brand element
 * across the site. If a single page ever needs it back, override with a
 * page-id-specific selector.
 */
.hero-red-line {
	visibility: hidden !important;
	height: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 32px !important;
}

.hero-red-line .divider-inner {
	display: none !important;
}

/*
 * Section eyebrows — every [mk_fancy_title] with el_class="bekaa-kicker"
 * across the homepage. Pulls them into the system eyebrow vocabulary
 * (12px, weight 600, tracked 0.18em, system stack). Color is left to the
 * shortcode's color attr so it stays context-correct (dark on white-bg
 * sections, white on cinematic dark-bg sections).
 *
 * Jupiter generates per-instance #fancy-title-XYZ rules via inline <style>
 * blocks that hard-code font-size / weight / letter-spacing — !important
 * is required to override them.
 */
body.bekaa-home-wd-transition-page .bekaa-kicker,
body.bekaa-home-wd-transition-page .bekaa-kicker > span,
body.bekaa-home-wd-transition-page .bekaa-kicker > p {
	font-family: var(--bekaa-system-font, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
	font-size: var(--bekaa-fs-eyebrow-large, 12px) !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: var(--bekaa-tracking-eyebrow, 0.18em) !important;
}

/*
 * Body paragraphs inside [vc_column_text] — the 3-column "Brisbane"
 * section and any similar content blocks on the homepage. Wires them into
 * the system body vocabulary (15px, 1.6, system stack). Color is left
 * untouched so existing contextual coloring still applies.
 */
body.bekaa-home-wd-transition-page .wpb_text_column .wpb_wrapper p {
	font-family: var(--bekaa-system-font, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
	font-size: var(--bekaa-fs-body, 15px) !important;
	font-weight: 400 !important;
	line-height: var(--bekaa-lh-body, 1.6) !important;
	letter-spacing: var(--bekaa-tracking-body, 0.005em) !important;
}

body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) > span,
body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) p {
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
	letter-spacing: inherit !important;
}

/*
 * Constrain reading column to the narrow White Desert-style measure.
 * The inner <p> is block-level by default, so max-width applies cleanly
 * without forcing display changes on the outer wrapper.
 */
body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) p {
	max-width: 30ch !important;
	margin-right: auto;
}

@media (max-width: 1024px) {
	body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) {
		font-size: 15px !important;
	}

	body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) p {
		max-width: 32ch !important;
	}
}

@media (max-width: 767px) {
	body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) {
		font-size: 16px !important;
		letter-spacing: 0.003em !important;
	}

	body.bekaa-home-wd-transition-page span.mk-fancy-title:has(p) p {
		max-width: none !important;
	}
}
