/* ==========================================================================
   ELUME MODERN SKIN  (staging preview)
   Overlay stylesheet. Loads after theme + all elume-* mu-plugin CSS.
   Design tokens from the brand palette: cyan #00c9fc (decorative only,
   needs dark text), #00699a WCAG-safe action blue, #f6fbfd tint.
   ========================================================================== */

:root {
	--em-cyan: #00c9fc;
	--em-blue: #00699a;
	--em-blue-deep: #00506f;
	--em-ink: #0c2531;
	--em-ink-soft: #33505e;
	--em-tint: #f6fbfd;
	--em-line: #dcebf2;
	--em-grad: linear-gradient(120deg, #00c9fc 0%, #0090cf 55%, #00699a 100%);
	--em-radius: 20px;
	--em-radius-sm: 12px;
	--em-shadow-1: 0 1px 2px rgba(12, 37, 49, 0.06), 0 8px 24px rgba(12, 37, 49, 0.07);
	--em-shadow-2: 0 2px 4px rgba(12, 37, 49, 0.08), 0 18px 44px rgba(12, 37, 49, 0.13);
	--em-font-display: "Sora", "Hind", sans-serif;
	--em-font-body: "Inter", "Hind", sans-serif;
}

/* --------------------------------------------------------------------------
   1. Base: typography + page canvas
   -------------------------------------------------------------------------- */

body.elume-modern {
	/* !important: theme style.css pins Quicksand on body and wins otherwise */
	font-family: var(--em-font-body) !important;
	color: var(--em-ink-soft);
	background-color: #fff;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body.elume-modern h1,
body.elume-modern h2,
body.elume-modern h3,
body.elume-modern h4,
body.elume-modern h5 {
	font-family: var(--em-font-display);
	color: var(--em-ink);
	letter-spacing: -0.02em;
	line-height: 1.18;
}

body.elume-modern p,
body.elume-modern li {
	line-height: 1.7;
}

body.elume-modern .site-inner a:not(.button):not(.solutions-item) {
	color: var(--em-blue);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 0.15s ease;
}

body.elume-modern .site-inner a:not(.button):not(.solutions-item):hover {
	color: var(--em-blue-deep);
}

body.elume-modern ::selection {
	background: rgba(0, 201, 252, 0.28);
}

body.elume-modern :focus-visible {
	outline: 2px solid var(--em-blue);
	outline-offset: 2px;
	border-radius: 4px;
}

/* --------------------------------------------------------------------------
   2. Buttons: pill, confident, one system everywhere
   -------------------------------------------------------------------------- */

body.elume-modern .button,
body.elume-modern button.button,
body.elume-modern .site-inner input[type="submit"],
body.elume-modern .gform_button {
	font-family: var(--em-font-display);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.01em;
	text-transform: none;
	color: #fff;
	background: var(--em-blue);
	border: 0;
	border-radius: 999px;
	padding: 15px 30px;
	box-shadow: 0 6px 18px rgba(0, 105, 154, 0.28);
	transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

body.elume-modern .button:hover,
body.elume-modern button.button:hover,
body.elume-modern .site-inner input[type="submit"]:hover,
body.elume-modern .gform_button:hover {
	color: #fff;
	background: var(--em-blue-deep);
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(0, 80, 111, 0.34);
}

body.elume-modern .button:active {
	transform: translateY(0);
}

/* Hero "Book An Appointment": glass white pill over the photo */
body.elume-modern #white-button,
body.elume-modern #white-button.button {
	border-radius: 999px !important; /* theme pins 0 on this id */
	color: var(--em-ink);
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.6);
	box-shadow: 0 8px 28px rgba(12, 37, 49, 0.22);
}

body.elume-modern #white-button:hover {
	color: var(--em-blue-deep);
	background: #fff;
}

/* --------------------------------------------------------------------------
   3. Header: slim ink top bar + sticky glass header
   -------------------------------------------------------------------------- */

body.elume-modern .top-bar {
	background: var(--em-ink);
	color: #cfe8f3;
	font-size: 13px;
}

body.elume-modern .top-bar a,
body.elume-modern .top-bar .social-icon-wrapper i {
	color: #cfe8f3;
	transition: color 0.15s ease;
}

body.elume-modern .top-bar a:hover,
body.elume-modern .top-bar .social-icon-wrapper:hover i {
	color: var(--em-cyan);
}

body.elume-modern .site-header {
	background: rgba(255, 255, 255, 0.82);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	backdrop-filter: saturate(160%) blur(14px);
	box-shadow: 0 1px 0 rgba(12, 37, 49, 0.06);
	transition: box-shadow 0.25s ease, background-color 0.25s ease;
}

body.elume-modern.em-scrolled .site-header {
	box-shadow: 0 6px 24px rgba(12, 37, 49, 0.09);
}

/* Nav: quiet links, animated underline */
body.elume-modern .genesis-nav-menu a {
	font-family: var(--em-font-display);
	font-size: 14.5px;
	font-weight: 500;
	color: var(--em-ink);
	position: relative;
	transition: color 0.15s ease;
}

body.elume-modern .genesis-nav-menu > .menu-item > a::after {
	content: "";
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: 8px;
	height: 2px;
	border-radius: 2px;
	background: var(--em-grad);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.22s ease;
}

body.elume-modern .genesis-nav-menu > .menu-item > a:hover::after,
body.elume-modern .genesis-nav-menu > .current-menu-item > a::after {
	transform: scaleX(1);
}

body.elume-modern .genesis-nav-menu a:hover {
	color: var(--em-blue);
}

/* Dropdowns: soft glass panels */
body.elume-modern .genesis-nav-menu .sub-menu {
	background: rgba(255, 255, 255, 0.96);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border: 1px solid var(--em-line);
	border-radius: 14px;
	box-shadow: var(--em-shadow-2);
	padding: 8px;
	overflow: hidden;
}

body.elume-modern .genesis-nav-menu .sub-menu a {
	border: 0;
	border-radius: 9px;
	transition: background-color 0.14s ease, color 0.14s ease;
}

body.elume-modern .genesis-nav-menu .sub-menu a:hover {
	background: var(--em-tint);
	color: var(--em-blue);
}

/* --------------------------------------------------------------------------
   4. Hero carousel: gradient scrim + glass copy card
   -------------------------------------------------------------------------- */

body.elume-modern .front-page-1 .carousel-item {
	position: relative;
	background-size: cover;
	background-position: center;
}

body.elume-modern .front-page-1 .carousel-item::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(100deg, rgba(246, 251, 253, 0.9) 0%, rgba(246, 251, 253, 0.55) 38%, rgba(246, 251, 253, 0) 68%),
		linear-gradient(0deg, rgba(0, 201, 252, 0.1), rgba(0, 201, 252, 0));
	pointer-events: none;
}

body.elume-modern .container_full-width-slider {
	position: relative;
	z-index: 1;
}

/* Copy blocks become one glass card */
body.elume-modern .container_two-thirds-slider-copy {
	display: inline-block;
	background: rgba(255, 255, 255, 0.72);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border: 1px solid rgba(255, 255, 255, 0.65);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-2);
	padding: 30px 34px;
}

body.elume-modern .top-copy_large,
body.elume-modern .top-copy_large.gray-bg {
	background: transparent;
	font-family: var(--em-font-display);
	font-weight: 700;
	color: var(--em-ink);
	letter-spacing: -0.02em;
}

body.elume-modern .top-copy_large a {
	background: var(--em-grad);
	-webkit-background-clip: text;
	background-clip: text;
	color: var(--em-blue);
	-webkit-text-fill-color: transparent;
	text-decoration: none;
	text-shadow: none;
}

body.elume-modern .secondary-copy,
body.elume-modern .secondary-copy.white-bg {
	background: transparent;
	color: var(--em-ink-soft);
}

body.elume-modern #discount-text_gray-bg {
	display: inline-block;
	background: rgba(0, 201, 252, 0.16);
	color: var(--em-blue-deep);
	border-radius: 999px;
	padding: 3px 14px;
	font-weight: 600;
	font-size: 0.85em;
}

/* --------------------------------------------------------------------------
   5. Section rhythm + headings
   -------------------------------------------------------------------------- */

body.elume-modern .fp2,
body.elume-modern .fp3 {
	padding-top: 30px;
	padding-bottom: 30px;
}

body.elume-modern .fp2 {
	background:
		radial-gradient(900px 420px at 88% 0%, rgba(0, 201, 252, 0.07), transparent 60%),
		#fff;
}

body.elume-modern .fp3 {
	background:
		radial-gradient(900px 420px at 10% 100%, rgba(0, 201, 252, 0.08), transparent 60%),
		var(--em-tint);
}

body.elume-modern .fp-heading {
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 700;
	text-align: center;
	position: relative;
	padding-bottom: 18px;
}

body.elume-modern .fp-heading::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 56px;
	height: 4px;
	border-radius: 4px;
	background: var(--em-grad);
}

/* --------------------------------------------------------------------------
   6. Treatment cards
   -------------------------------------------------------------------------- */

body.elume-modern .solutions-item {
	border-radius: var(--em-radius);
	overflow: hidden;
	box-shadow: var(--em-shadow-1);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	isolation: isolate;
}

body.elume-modern .solutions-item::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(12, 37, 49, 0.62) 0%, rgba(12, 37, 49, 0.12) 42%, rgba(12, 37, 49, 0) 62%);
	z-index: 0;
	pointer-events: none;
	transition: opacity 0.25s ease;
}

body.elume-modern .solutions-item:hover {
	transform: translateY(-6px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .solution-header {
	position: relative;
	z-index: 1;
	color: #fff;
	font-weight: 600;
	letter-spacing: -0.01em;
	text-shadow: 0 2px 10px rgba(12, 37, 49, 0.45);
}

body.elume-modern .solution-overlay {
	background: linear-gradient(0deg, rgba(0, 105, 154, 0.55), rgba(0, 201, 252, 0.25));
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

body.elume-modern .solution-button {
	box-shadow: none;
}

/* --------------------------------------------------------------------------
   7. Google reviews: card treatment
   -------------------------------------------------------------------------- */

body.elume-modern .wp-google-review,
body.elume-modern .fp-testimonials .wp-google-review {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm) !important;
	box-shadow: var(--em-shadow-1);
	padding: 18px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.elume-modern .wp-google-review:hover {
	transform: translateY(-3px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .wp-google-place {
	background: transparent;
}

/* --------------------------------------------------------------------------
   8. Products band ("Take Your Results Home")
   -------------------------------------------------------------------------- */

body.elume-modern .elume-fp-products {
	background:
		radial-gradient(1000px 500px at 50% -10%, rgba(0, 201, 252, 0.06), transparent 60%),
		#fff;
}

body.elume-modern .elume-fp-grid > * {
	border-radius: var(--em-radius-sm);
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.elume-modern .elume-fp-grid > *:hover {
	transform: translateY(-4px);
	box-shadow: var(--em-shadow-1);
}

/* --------------------------------------------------------------------------
   9. Pre-footer CTA band + footer: deep ink
   -------------------------------------------------------------------------- */

body.elume-modern .before-footer {
	background:
		radial-gradient(800px 300px at 15% 0%, rgba(0, 201, 252, 0.16), transparent 55%),
		var(--em-ink);
	color: #e6f3f9;
}

body.elume-modern .before-footer a:not(.button) {
	color: #e6f3f9;
}

body.elume-modern .footer-widgets {
	background: var(--em-ink);
	color: #b9cfd9;
	font-size: 14.5px;
}

body.elume-modern .footer-widgets h3,
body.elume-modern .footer-widgets .widget-title {
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

body.elume-modern .footer-widgets a {
	color: #b9cfd9;
	transition: color 0.15s ease;
}

body.elume-modern .footer-widgets a:hover {
	color: var(--em-cyan);
}

body.elume-modern .site-footer {
	background: #081b25;
	color: #8aa7b4;
	font-size: 13px;
}

body.elume-modern .site-footer a {
	color: #b9cfd9;
}

/* --------------------------------------------------------------------------
   10. Scroll reveal (JS adds .em-reveal; .em-in when visible)
   -------------------------------------------------------------------------- */

body.elume-modern .em-reveal {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

body.elume-modern .em-reveal.em-in {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	body.elume-modern .em-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	body.elume-modern .solutions-item,
	body.elume-modern .wp-google-review,
	body.elume-modern .button {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   11. Article / entry content typography
   -------------------------------------------------------------------------- */

body.elume-modern .entry-content {
	font-size: 17px;
	color: var(--em-ink-soft);
}

body.elume-modern .entry-content h2 {
	margin-top: 1.6em;
	font-size: clamp(24px, 3vw, 30px);
}

body.elume-modern .entry-content h3 {
	font-size: clamp(19px, 2.4vw, 23px);
}

body.elume-modern .entry-content img {
	border-radius: var(--em-radius-sm);
}

body.elume-modern .entry-content blockquote {
	background: var(--em-tint);
	border-left: 4px solid var(--em-cyan);
	border-radius: 0 var(--em-radius-sm) var(--em-radius-sm) 0;
	padding: 18px 22px;
}

body.elume-modern .entry-content table {
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	overflow: hidden;
}

body.elume-modern .entry-content th {
	background: var(--em-tint);
	font-family: var(--em-font-display);
	font-weight: 600;
	color: var(--em-ink);
}

/* --------------------------------------------------------------------------
   12. Treatment template blocks (new-service-template)
   -------------------------------------------------------------------------- */

body.elume-modern .container_process-box {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.elume-modern .container_process-box:hover {
	transform: translateY(-4px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .block_faq-section .container_faq {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	box-shadow: var(--em-shadow-1);
	transition: box-shadow 0.2s ease;
}

body.elume-modern .block_faq-section .container_faq:hover {
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .container_related-page {
	border-radius: var(--em-radius) !important;
	overflow: hidden;
	box-shadow: var(--em-shadow-1);
	transition: transform 0.22s ease, box-shadow 0.22s ease;
}

body.elume-modern .container_related-page:hover {
	transform: translateY(-5px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .block_schedule-cta-section,
body.elume-modern .container_schedule-cta {
	background:
		radial-gradient(700px 280px at 85% 0%, rgba(0, 201, 252, 0.18), transparent 55%),
		var(--em-ink);
	border-radius: var(--em-radius);
	color: #e6f3f9;
}

body.elume-modern .block_schedule-cta-section h2,
body.elume-modern .block_schedule-cta-section h3,
body.elume-modern .container_schedule-cta h2,
body.elume-modern .container_schedule-cta h3 {
	color: #fff;
}

body.elume-modern .m8-book-panel,
body.elume-modern .schedule-block {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
}

body.elume-modern .schedule-special-offer {
	background: rgba(0, 201, 252, 0.12);
	border: 1px solid rgba(0, 201, 252, 0.35);
	border-radius: var(--em-radius-sm);
	color: var(--em-blue-deep);
}

/* --------------------------------------------------------------------------
   13. Forms (Gravity Forms + generic)
   -------------------------------------------------------------------------- */

body.elume-modern .site-inner input[type="text"],
body.elume-modern .site-inner input[type="email"],
body.elume-modern .site-inner input[type="tel"],
body.elume-modern .site-inner input[type="number"],
body.elume-modern .site-inner input[type="date"],
body.elume-modern .site-inner select,
body.elume-modern .site-inner textarea {
	font-family: var(--em-font-body);
	font-size: 16px;
	color: var(--em-ink);
	background: #fff;
	border: 1.5px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	padding: 12px 16px;
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.elume-modern .site-inner input:focus,
body.elume-modern .site-inner select:focus,
body.elume-modern .site-inner textarea:focus {
	border-color: var(--em-blue);
	box-shadow: 0 0 0 4px rgba(0, 201, 252, 0.18);
	outline: none;
}

body.elume-modern .gfield_label,
body.elume-modern .gfield legend {
	font-family: var(--em-font-display);
	font-weight: 500;
	color: var(--em-ink);
}

body.elume-modern .gfield_required_asterisk {
	color: var(--em-blue);
}

/* --------------------------------------------------------------------------
   14. Small screens: keep the glass card readable, relax paddings
   -------------------------------------------------------------------------- */

@media only screen and (max-width: 768px) {
	body.elume-modern .container_two-thirds-slider-copy {
		padding: 20px 22px;
	}

	body.elume-modern .fp-heading {
		font-size: 26px;
	}
}

/* --------------------------------------------------------------------------
   15. New homepage sections (elume-modern-sections.php)
   -------------------------------------------------------------------------- */

body.elume-modern .em-sec {
	padding: 76px 24px;
}

body.elume-modern .em-wrap {
	max-width: 1140px;
	margin: 0 auto;
}

body.elume-modern .em-eyebrow {
	font-family: var(--em-font-display);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--em-blue);
	margin: 0 0 10px;
}

body.elume-modern .em-h2 {
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 700;
	margin: 0 0 14px;
}

body.elume-modern .em-lede {
	font-size: 17.5px;
	color: var(--em-ink-soft);
	max-width: 640px;
}

body.elume-modern .em-sec-head {
	text-align: center;
}

body.elume-modern .em-sec-head .em-lede {
	margin-left: auto;
	margin-right: auto;
}

/* Why Elume pillars */
body.elume-modern .em-why {
	background:
		radial-gradient(900px 400px at 12% 0%, rgba(0, 201, 252, 0.07), transparent 60%),
		#fff;
}

body.elume-modern .em-pillars {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px;
	margin-top: 44px;
}

body.elume-modern .em-pillar {
	background: rgba(255, 255, 255, 0.8);
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	padding: 28px 24px;
	transition: transform 0.22s ease, box-shadow 0.22s ease;
}

body.elume-modern .em-pillar:hover {
	transform: translateY(-5px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .em-pillar-ico {
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 16px;
	background: linear-gradient(135deg, rgba(0, 201, 252, 0.16), rgba(0, 105, 154, 0.1));
	margin-bottom: 16px;
}

body.elume-modern .em-pillar-ico svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: var(--em-blue);
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

body.elume-modern .em-pillar h3 {
	font-size: 17.5px;
	font-weight: 600;
	margin: 0 0 8px;
}

body.elume-modern .em-pillar p {
	font-size: 15px;
	line-height: 1.65;
	margin: 0;
	color: var(--em-ink-soft);
}

/* Founder */
body.elume-modern .em-founder {
	background:
		radial-gradient(800px 400px at 90% 100%, rgba(0, 201, 252, 0.09), transparent 60%),
		var(--em-tint);
}

body.elume-modern .em-founder-grid {
	display: grid;
	grid-template-columns: 340px minmax(0, 1fr);
	gap: 52px;
	align-items: center;
}

body.elume-modern .em-founder-media {
	position: relative;
}

body.elume-modern .em-founder-media img {
	width: 100%;
	height: auto;
	border-radius: 28px;
	box-shadow: var(--em-shadow-2);
	display: block;
}

body.elume-modern .em-founder-media::before {
	content: "";
	position: absolute;
	inset: -14px;
	border-radius: 36px;
	background: var(--em-grad);
	opacity: 0.18;
	z-index: -1;
}

body.elume-modern .em-founder-copy p {
	font-size: 17px;
}

body.elume-modern .em-founder-ctas {
	display: flex;
	align-items: center;
	gap: 22px;
	margin: 24px 0 26px;
	flex-wrap: wrap;
}

body.elume-modern .em-ghost-link {
	font-family: var(--em-font-display);
	font-weight: 600;
	font-size: 15px;
	color: var(--em-blue);
}

body.elume-modern .em-info-chips {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 12px;
}

body.elume-modern .em-info-chips li {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: 999px;
	padding: 9px 16px;
	font-size: 13.5px;
	color: var(--em-ink-soft);
	display: inline-flex;
	align-items: center;
	gap: 7px;
	line-height: 1.3;
}

/* Elume line products */
body.elume-modern .em-line {
	background:
		radial-gradient(900px 420px at 85% 10%, rgba(0, 201, 252, 0.06), transparent 60%),
		#fff;
}

body.elume-modern .em-prods {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-top: 44px;
}

body.elume-modern a.em-prod {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 6px;
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	padding: 26px 22px 28px;
	text-decoration: none;
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

body.elume-modern a.em-prod:hover {
	transform: translateY(-6px);
	box-shadow: var(--em-shadow-2);
	border-color: rgba(0, 201, 252, 0.5);
}

body.elume-modern .em-prod-imgwrap {
	width: 100%;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--em-tint);
	border-radius: var(--em-radius-sm);
	overflow: hidden;
	margin-bottom: 16px;
}

body.elume-modern .em-prod-imgwrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--em-radius-sm);
	transition: transform 0.35s ease;
}

body.elume-modern a.em-prod:hover .em-prod-imgwrap img {
	transform: scale(1.045);
}

body.elume-modern .em-prod-name {
	font-family: var(--em-font-display);
	font-weight: 600;
	font-size: 17px;
	color: var(--em-ink);
	line-height: 1.35;
}

body.elume-modern .em-prod-price {
	font-size: 15px;
	font-weight: 600;
	color: var(--em-blue-deep);
	background: rgba(0, 201, 252, 0.12);
	border-radius: 999px;
	padding: 3px 14px;
}

body.elume-modern .em-prod-cta {
	margin-top: 10px;
	font-family: var(--em-font-display);
	font-weight: 600;
	font-size: 14px;
	color: var(--em-blue);
}

body.elume-modern a.em-prod:hover .em-prod-cta {
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.elume-modern .em-line-footer {
	text-align: center;
	margin-top: 42px;
}

/* Responsive */
@media only screen and (max-width: 1020px) {
	body.elume-modern .em-pillars {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media only screen and (max-width: 860px) {
	body.elume-modern .em-founder-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 34px;
	}

	body.elume-modern .em-founder-media {
		max-width: 320px;
		margin: 0 auto;
	}

	body.elume-modern .em-prods {
		grid-template-columns: minmax(0, 1fr);
		max-width: 420px;
		margin-left: auto;
		margin-right: auto;
	}
}

@media only screen and (max-width: 640px) {
	body.elume-modern .em-sec {
		padding: 54px 18px;
	}

	body.elume-modern .em-pillars {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --------------------------------------------------------------------------
   16. Hero: Ken Burns + trust chips + call link
   -------------------------------------------------------------------------- */

body.elume-modern .front-page-1 .carousel-item {
	overflow: hidden;
	isolation: isolate;
}

body.elume-modern .em-hero-bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	background-size: cover;
	background-position: center;
	animation: em-kenburns 26s ease-in-out infinite alternate;
}

@keyframes em-kenburns {
	from { transform: scale(1) translateX(0); }
	to { transform: scale(1.07) translateX(-1.2%); }
}

body.elume-modern .front-page-1 .carousel-item::before {
	z-index: 0;
}

body.elume-modern .em-hero-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 18px;
}

body.elume-modern .em-hero-chip {
	font-family: var(--em-font-display);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--em-blue-deep);
	background: rgba(255, 255, 255, 0.75);
	border: 1px solid rgba(0, 201, 252, 0.35);
	border-radius: 999px;
	padding: 6px 14px;
	white-space: nowrap;
}

body.elume-modern .em-hero-call {
	display: block;
	margin-top: 12px;
	font-family: var(--em-font-display);
	font-size: 14.5px;
	font-weight: 600;
	color: var(--em-ink);
	text-shadow: 0 1px 6px rgba(255, 255, 255, 0.8);
}

/* --------------------------------------------------------------------------
   17. Featured Treatments: price chips
   -------------------------------------------------------------------------- */

body.elume-modern .solutions-item {
	position: relative;
}

body.elume-modern .em-price-chip {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 2;
	font-family: var(--em-font-display);
	font-size: 13px;
	font-weight: 600;
	color: var(--em-ink);
	background: rgba(255, 255, 255, 0.88);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	border-radius: 999px;
	padding: 6px 14px;
	box-shadow: 0 4px 14px rgba(12, 37, 49, 0.18);
}

/* --------------------------------------------------------------------------
   18. Reviews: rating headline
   -------------------------------------------------------------------------- */

body.elume-modern .em-rating-line {
	text-align: center;
	font-size: 16px;
	color: var(--em-ink-soft);
	margin: 14px 0 0;
}

body.elume-modern .em-rating-score {
	font-family: var(--em-font-display);
	font-size: 34px;
	font-weight: 700;
	background: var(--em-grad);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-right: 6px;
	vertical-align: -2px;
}

/* --------------------------------------------------------------------------
   19. Treatment page FAQ accordions
   -------------------------------------------------------------------------- */

body.elume-modern .container_faq.em-acc h3 {
	cursor: pointer;
	position: relative;
	padding-right: 44px;
	margin: 0;
	user-select: none;
}

body.elume-modern .container_faq.em-acc h3::after {
	content: "";
	position: absolute;
	right: 6px;
	top: 50%;
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--em-blue);
	border-bottom: 2px solid var(--em-blue);
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.25s ease;
}

body.elume-modern .container_faq.em-acc.em-open h3::after {
	transform: translateY(-30%) rotate(-135deg);
}

body.elume-modern .container_faq.em-acc > div {
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	transition: max-height 0.35s ease, opacity 0.3s ease, margin-top 0.3s ease;
	margin-top: 0;
}

body.elume-modern .container_faq.em-acc.em-open > div {
	max-height: 900px;
	opacity: 1;
	margin-top: 12px;
}

/* --------------------------------------------------------------------------
   20. Homepage FAQ (details/summary)
   -------------------------------------------------------------------------- */

body.elume-modern .em-hfaq {
	background: var(--em-tint);
}

body.elume-modern .em-hfaq-wrap {
	max-width: 820px;
}

body.elume-modern .em-hfaq-list {
	margin-top: 38px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

body.elume-modern .em-hfaq-item {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	box-shadow: var(--em-shadow-1);
	padding: 0;
	overflow: hidden;
}

body.elume-modern .em-hfaq-item summary {
	list-style: none;
	cursor: pointer;
	font-family: var(--em-font-display);
	font-size: 16.5px;
	font-weight: 600;
	color: var(--em-ink);
	padding: 20px 56px 20px 24px;
	position: relative;
}

body.elume-modern .em-hfaq-item summary::-webkit-details-marker {
	display: none;
}

body.elume-modern .em-hfaq-item summary::after {
	content: "";
	position: absolute;
	right: 24px;
	top: 50%;
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--em-blue);
	border-bottom: 2px solid var(--em-blue);
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.25s ease;
}

body.elume-modern .em-hfaq-item[open] summary::after {
	transform: translateY(-30%) rotate(-135deg);
}

body.elume-modern .em-hfaq-a {
	padding: 0 24px 20px;
	font-size: 15.5px;
}

body.elume-modern .em-hfaq-a p {
	margin: 0;
}

/* --------------------------------------------------------------------------
   21. Treatment sticky booking card (desktop)
   -------------------------------------------------------------------------- */

body.elume-modern .em-bookcard {
	display: none;
}

@media only screen and (min-width: 1100px) {
	body.elume-modern .em-bookcard {
		display: block;
		position: fixed;
		right: 26px;
		bottom: 96px;
		width: 296px;
		z-index: 900;
		background: rgba(255, 255, 255, 0.9);
		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);
		border: 1px solid var(--em-line);
		border-radius: var(--em-radius);
		box-shadow: var(--em-shadow-2);
		padding: 22px 22px 20px;
		opacity: 0;
		transform: translateY(16px);
		pointer-events: none;
		transition: opacity 0.3s ease, transform 0.3s ease;
	}

	body.elume-modern .em-bookcard.em-show {
		opacity: 1;
		transform: none;
		pointer-events: auto;
	}
}

body.elume-modern .em-bookcard-kicker {
	font-family: var(--em-font-display);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--em-blue);
	margin: 0 0 6px;
}

body.elume-modern .em-bookcard-title {
	font-family: var(--em-font-display);
	font-size: 19px;
	font-weight: 700;
	color: var(--em-ink);
	margin: 0 0 6px;
}

body.elume-modern .em-bookcard-note {
	font-size: 13.5px;
	margin: 0 0 14px;
}

body.elume-modern .em-bookcard-btn {
	display: block;
	text-align: center;
	margin-bottom: 10px;
}

body.elume-modern .em-bookcard-call {
	display: block;
	text-align: center;
	font-size: 13.5px;
	color: var(--em-blue);
}

/* --------------------------------------------------------------------------
   22. Blog: byline card, progress bar, related posts, index grid
   -------------------------------------------------------------------------- */

body.elume-modern .em-byline {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: var(--em-tint);
	border: 1px solid var(--em-line);
	border-radius: 999px;
	padding: 8px 20px 8px 8px;
	margin: 6px 0 10px;
}

body.elume-modern .em-byline img {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

body.elume-modern .em-byline-txt {
	display: flex;
	flex-direction: column;
	line-height: 1.35;
}

body.elume-modern .em-byline-name {
	font-family: var(--em-font-display);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--em-ink);
}

body.elume-modern .em-byline-role {
	font-size: 12.5px;
	color: var(--em-ink-soft);
}

body.elume-modern .em-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 9999;
	background: transparent;
	pointer-events: none;
}

body.elume-modern .em-progress-fill {
	display: block;
	height: 100%;
	width: 0;
	background: var(--em-grad);
}

body.elume-modern .em-related {
	margin: 46px 0 10px;
}

body.elume-modern .em-related-h {
	font-size: 24px;
	margin-bottom: 20px;
}

body.elume-modern .em-related-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

body.elume-modern a.em-related-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	box-shadow: var(--em-shadow-1);
	padding: 22px;
	text-decoration: none;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.elume-modern a.em-related-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .em-related-cat {
	font-family: var(--em-font-display);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--em-blue);
}

body.elume-modern .em-related-title {
	font-family: var(--em-font-display);
	font-size: 16.5px;
	font-weight: 600;
	color: var(--em-ink);
	line-height: 1.4;
}

body.elume-modern .em-related-more {
	margin-top: auto;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--em-blue);
}

/* Blog index: card grid */
body.elume-modern.blog .content {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

body.elume-modern.blog .content > .archive-description {
	grid-column: 1 / -1;
	background: transparent;
	padding-bottom: 4px;
}

body.elume-modern.blog .content > article.entry {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	padding: 30px 30px 26px;
	margin: 0;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	display: flex;
	flex-direction: column;
}

body.elume-modern.blog .content > article.entry:hover {
	transform: translateY(-4px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern.blog .entry-categories a {
	font-family: var(--em-font-display);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--em-blue);
	text-decoration: none;
}

body.elume-modern.blog .entry-title {
	font-size: 22px;
	line-height: 1.3;
}

body.elume-modern.blog .entry-title a {
	color: var(--em-ink);
	text-decoration: none;
}

body.elume-modern.blog .entry-title a:hover {
	color: var(--em-blue);
}

body.elume-modern .button.light.more-link {
	background: transparent;
	color: var(--em-blue);
	border: 1.5px solid var(--em-line);
	box-shadow: none;
	padding: 11px 24px;
	align-self: flex-start;
	margin-top: auto;
}

body.elume-modern .button.light.more-link:hover {
	background: var(--em-tint);
	color: var(--em-blue-deep);
	transform: none;
	box-shadow: none;
}

/* --------------------------------------------------------------------------
   23. Mobile action bar + back-to-top
   -------------------------------------------------------------------------- */

body.elume-modern .em-actionbar {
	display: none;
}

@media only screen and (max-width: 860px) {
	body.elume-modern .em-actionbar {
		display: flex;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 950;
		background: rgba(12, 37, 49, 0.92);
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px);
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
		gap: 10px;
	}

	body.elume-modern {
		padding-bottom: 68px;
	}

	body.elume-modern .em-actionbar a {
		flex: 1;
		text-align: center;
		font-family: var(--em-font-display);
		font-weight: 600;
		font-size: 15px;
		border-radius: 999px;
		padding: 13px 10px;
		text-decoration: none;
	}

	body.elume-modern .em-actionbar-call {
		color: #fff !important;
		border: 1.5px solid rgba(255, 255, 255, 0.55);
	}

	body.elume-modern .em-actionbar-book {
		color: #fff !important;
		background: var(--em-blue);
		box-shadow: 0 4px 14px rgba(0, 105, 154, 0.4);
	}
}

body.elume-modern .em-top {
	position: fixed;
	right: 22px;
	bottom: 26px;
	z-index: 940;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid var(--em-line);
	background: rgba(255, 255, 255, 0.9);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	box-shadow: var(--em-shadow-1);
	color: var(--em-blue);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	transform: translateY(12px);
	pointer-events: none;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

body.elume-modern .em-top.em-show {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

body.elume-modern .em-top svg {
	width: 20px;
	height: 20px;
}

@media only screen and (max-width: 860px) {
	body.elume-modern .em-top {
		bottom: 86px;
	}
}

/* --------------------------------------------------------------------------
   24. Process timeline badges
   -------------------------------------------------------------------------- */

body.elume-modern .container_process-box {
	position: relative;
}

body.elume-modern .container_process-box[data-info]::after {
	content: attr(data-info);
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	width: 34px;
	height: 34px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--em-font-display);
	font-weight: 700;
	font-size: 15px;
	color: #fff;
	background: var(--em-grad);
	border-radius: 50%;
	box-shadow: 0 4px 12px rgba(0, 105, 154, 0.35);
}

/* --------------------------------------------------------------------------
   25. 404 + schedule page
   -------------------------------------------------------------------------- */

body.elume-modern .em-404 {
	text-align: center;
	padding: 30px 0 50px;
}

body.elume-modern .em-404-lede {
	font-size: 18px;
	max-width: 520px;
	margin: 0 auto 28px;
}

body.elume-modern .em-404-links {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
}

body.elume-modern .em-sched-chips {
	margin: 0 0 26px;
}

body.elume-modern .gform_wrapper {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	padding: 30px 28px;
}

/* --------------------------------------------------------------------------
   26. Mobile nav polish
   -------------------------------------------------------------------------- */

@media only screen and (max-width: 992px) {
	body.elume-modern .nav-primary {
		background: rgba(255, 255, 255, 0.97);
		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);
		border-radius: 0 0 var(--em-radius) var(--em-radius);
		box-shadow: var(--em-shadow-2);
	}

	body.elume-modern .genesis-nav-menu a {
		font-size: 16px;
		padding-top: 14px;
		padding-bottom: 14px;
	}

	body.elume-modern button.menu-toggle {
		border-radius: 12px;
		color: var(--em-ink);
	}
}

/* Responsive for new blocks */
@media only screen and (max-width: 860px) {
	body.elume-modern .em-related-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	body.elume-modern.blog .content {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --------------------------------------------------------------------------
   27. Blog card thumbnails + header Shop button
   -------------------------------------------------------------------------- */

body.elume-modern.blog .entry-image-link {
	display: block;
	order: -1;
	margin: -30px -30px 20px;
	border-radius: var(--em-radius) var(--em-radius) 0 0;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

body.elume-modern.blog .entry-image-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.35s ease;
}

body.elume-modern.blog article.entry:hover .entry-image-link img {
	transform: scale(1.04);
}

body.elume-modern .site-header .wrap {
	position: relative;
}

body.elume-modern .em-shop-btn {
	display: none;
}

@media only screen and (min-width: 1200px) {
	body.elume-modern .em-shop-btn {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		font-family: var(--em-font-display);
		font-size: 14px;
		font-weight: 600;
		color: var(--em-blue-deep);
		background: rgba(0, 201, 252, 0.14);
		border: 1px solid rgba(0, 201, 252, 0.4);
		border-radius: 999px;
		padding: 9px 18px;
		text-decoration: none;
		transition: background-color 0.18s ease, transform 0.18s ease;
	}

	body.elume-modern .em-shop-btn:hover {
		background: rgba(0, 201, 252, 0.24);
		transform: translateY(-50%) translateY(-1px);
		color: var(--em-blue-deep);
	}
}

/* --------------------------------------------------------------------------
   28. Treatments archive: service cards
   -------------------------------------------------------------------------- */

body.elume-modern .service-box {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	overflow: hidden;
	transition: transform 0.22s ease, box-shadow 0.22s ease;
}

body.elume-modern .service-box:hover {
	transform: translateY(-5px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern .service-featured-image {
	overflow: hidden;
}

body.elume-modern .service-featured-image img {
	width: 100%;
	display: block;
	transition: transform 0.35s ease;
}

body.elume-modern .service-box:hover .service-featured-image img {
	transform: scale(1.045);
}

body.elume-modern .service-title {
	font-size: 21px;
	font-weight: 700;
	margin-bottom: 2px;
}

body.elume-modern .service-category {
	display: inline-block;
	font-family: var(--em-font-display);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--em-blue-deep);
	background: rgba(0, 201, 252, 0.14);
	border-radius: 999px;
	padding: 4px 12px;
	margin: 0 0 10px;
}

body.elume-modern .service-short-description {
	font-size: 15px;
	line-height: 1.65;
	color: var(--em-ink-soft);
}

/* --------------------------------------------------------------------------
   29. Search results + pagination
   -------------------------------------------------------------------------- */

body.elume-modern.search .content > article.entry {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow-1);
	padding: 28px 30px;
	margin-bottom: 22px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.elume-modern.search .content > article.entry:hover {
	transform: translateY(-3px);
	box-shadow: var(--em-shadow-2);
}

body.elume-modern.search .entry-title {
	font-size: 21px;
}

body.elume-modern.search .entry-title a {
	color: var(--em-ink);
	text-decoration: none;
}

body.elume-modern.search .entry-title a:hover {
	color: var(--em-blue);
}

body.elume-modern .archive-pagination {
	margin: 34px 0 10px;
}

body.elume-modern .archive-pagination li {
	display: inline-block;
	margin: 0 4px 8px 0;
}

body.elume-modern .archive-pagination li a {
	display: inline-block;
	min-width: 42px;
	text-align: center;
	font-family: var(--em-font-display);
	font-weight: 600;
	font-size: 14.5px;
	color: var(--em-ink);
	background: #fff;
	border: 1.5px solid var(--em-line);
	border-radius: 999px;
	padding: 10px 16px;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

body.elume-modern .archive-pagination li a:hover {
	border-color: var(--em-blue);
	color: var(--em-blue);
	background: var(--em-tint);
}

body.elume-modern .archive-pagination li.active a {
	background: var(--em-blue);
	border-color: var(--em-blue);
	color: #fff;
}

body.elume-modern .archive-pagination li.pagination-omission {
	color: var(--em-ink-soft);
}

/* --------------------------------------------------------------------------
   30. Feedback round 1 (Cyrus, 2026-08-22)
   -------------------------------------------------------------------------- */

/* (a) The theme's fixed header overlaid page content: post titles sat under
   it and the menu covered the top of the hero. Sticky keeps the glass pinned
   on scroll but reserves its height in the layout, so nothing hides. */
body.elume-modern .site-header {
	position: sticky !important;
	top: 0;
}

/* (b) Shop pill removed from the header (overlapped the Book CTA). */
body.elume-modern .em-shop-btn {
	display: none !important;
}

/* (c) Hero copy card: smaller, so the photo reads. Cap the width, trim the
   padding, and rein in the theme's oversized slide typography. */
body.elume-modern .container_two-thirds-slider-copy {
	max-width: 460px;
	padding: 22px 26px;
}

body.elume-modern .top-copy_large,
body.elume-modern .top-copy_large.gray-bg {
	font-size: clamp(26px, 3vw, 38px);
	line-height: 1.15;
}

body.elume-modern .secondary-copy,
body.elume-modern .secondary-copy.white-bg {
	font-size: clamp(15px, 1.6vw, 18px);
}

body.elume-modern .em-hero-chips {
	margin-top: 12px;
}

@media only screen and (max-width: 768px) {
	body.elume-modern .container_two-thirds-slider-copy {
		max-width: 100%;
		padding: 18px 20px;
	}
}

/* --------------------------------------------------------------------------
   31. Reviews toggle + Yelp panel + blog shelf strip
   -------------------------------------------------------------------------- */

body.elume-modern .em-rev-toggle {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin-top: 18px;
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid var(--em-line);
	border-radius: 999px;
	padding: 5px;
	width: fit-content;
	margin-left: auto;
	margin-right: auto;
}

body.elume-modern .em-rev-tab {
	font-family: var(--em-font-display);
	font-size: 14px;
	font-weight: 600;
	color: var(--em-ink-soft);
	background: transparent;
	border: 0;
	border-radius: 999px;
	padding: 9px 22px;
	cursor: pointer;
	transition: background-color 0.18s ease, color 0.18s ease;
}

body.elume-modern .em-rev-tab.em-active {
	background: var(--em-blue);
	color: #fff;
}

body.elume-modern .em-rev-tab:not(.em-active):hover {
	color: var(--em-blue);
}

body.elume-modern .em-yelp-panel {
	max-width: 1140px;
	margin: 30px auto 0;
	padding: 0 24px;
}

body.elume-modern .em-yelp-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

body.elume-modern .em-yelp-card {
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	box-shadow: var(--em-shadow-1);
	padding: 22px 24px;
}

body.elume-modern .em-yelp-text {
	font-size: 15px;
	line-height: 1.7;
	margin: 0 0 12px;
}

body.elume-modern .em-yelp-meta {
	font-size: 13px;
	color: var(--em-ink-soft);
	margin: 0;
}

body.elume-modern .em-yelp-meta strong {
	color: var(--em-ink);
	font-family: var(--em-font-display);
}

body.elume-modern .em-yelp-link {
	text-align: center;
	margin: 22px 0 0;
	font-size: 14.5px;
}

@media only screen and (max-width: 760px) {
	body.elume-modern .em-yelp-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Blog shelf strip: compact, quiet */
body.elume-modern .em-shelf {
	margin: 40px 0 8px;
	background: var(--em-tint);
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius);
	padding: 22px 24px 16px;
}

body.elume-modern .em-shelf-kicker {
	font-family: var(--em-font-display);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--em-blue);
	margin: 0 0 14px;
}

body.elume-modern .em-shelf-row {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

body.elume-modern a.em-shelf-item {
	display: flex;
	align-items: center;
	gap: 12px;
	background: #fff;
	border: 1px solid var(--em-line);
	border-radius: var(--em-radius-sm);
	padding: 10px 14px;
	text-decoration: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

body.elume-modern a.em-shelf-item:hover {
	transform: translateY(-2px);
	box-shadow: var(--em-shadow-1);
}

body.elume-modern .em-shelf-item img {
	width: 44px;
	height: 44px;
	object-fit: cover;
	border-radius: 8px;
	flex-shrink: 0;
}

body.elume-modern .em-shelf-name {
	font-family: var(--em-font-display);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--em-ink);
	line-height: 1.3;
	flex: 1;
}

body.elume-modern .em-shelf-price {
	font-size: 13px;
	font-weight: 600;
	color: var(--em-blue-deep);
}

body.elume-modern .em-shelf-note {
	font-size: 13px;
	color: var(--em-ink-soft);
	margin: 12px 0 0;
}

@media only screen and (max-width: 760px) {
	body.elume-modern .em-shelf-row {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Front page: the theme padded .site-inner 147px to slide the hero under the
   old fixed header. With the sticky header that is dead space. */
body.elume-modern.front-page .site-inner {
	padding-top: 0;
}

/* Same story on other templates: the theme margins .site-inner down 140px to
   clear the old fixed header. Sticky reserves that space natively. */
body.elume-modern .site-inner {
	margin-top: 0 !important;
}

/* --------------------------------------------------------------------------
   32. Feedback round 2: FAQ chevrons + Morpheus8 schedule CTA block
   -------------------------------------------------------------------------- */

/* FAQ: the theme sizes the question h3 to its text, so the chevron (anchored
   to the h3's right edge) sat on the words. Span the full card instead. */
body.elume-modern .container_faq.em-acc h3 {
	display: block;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

/* Schedule CTA card: was a 350px white square with a calendar background
   image and gray text inside the dark band. Make it a proper CTA. */
body.elume-modern a.schedule-block,
body.elume-modern .schedule-block {
	background-image: none !important;
	background-color: transparent;
	background: linear-gradient(135deg, #0090cf 0%, #00506f 100%) !important;
	border: 0 !important;
	border-radius: 18px;
	width: auto;
	max-width: 350px;
	height: auto !important;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 30px 38px;
	text-decoration: none;
	box-shadow: 0 10px 30px rgba(0, 80, 111, 0.35);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.elume-modern .schedule-block:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 38px rgba(0, 80, 111, 0.45);
}

body.elume-modern .schedule-block h2 {
	color: #fff !important;
	font-size: clamp(20px, 2.4vw, 26px);
	font-weight: 700;
	margin: 0;
	text-align: center;
}

/* Offer pill: it sat as dark-blue-on-translucent-cyan over the dark band. */
body.elume-modern .block_schedule-cta-section .schedule-special-offer,
body.elume-modern .container_schedule-cta .schedule-special-offer {
	background: rgba(255, 255, 255, 0.94);
	border: 1px solid rgba(0, 201, 252, 0.5);
	color: var(--em-ink);
	font-weight: 600;
}

/* Gel photo beside the CTA: soften it into the band. */
body.elume-modern .container_schedule-cta .container_image-overlap .image-block {
	border-radius: var(--em-radius);
	overflow: hidden;
	box-shadow: var(--em-shadow-2);
}

/* --------------------------------------------------------------------------
   33. FAQ indicators v2: transform-free plus/minus glyphs
   (the rotated-border chevron rendered as an unrotated square in testing;
   these overrides come after section 19/20 and win by order)
   -------------------------------------------------------------------------- */

body.elume-modern .container_faq.em-acc h3::after,
body.elume-modern .container_faq.em-acc.em-open h3::after {
	content: "+";
	border: 0;
	width: 28px;
	height: 28px;
	right: 0;
	top: calc(50% - 14px);
	transform: none;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--em-font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1;
	color: var(--em-blue);
	background: rgba(0, 201, 252, 0.12);
	border-radius: 50%;
	transition: background-color 0.2s ease, color 0.2s ease;
}

body.elume-modern .container_faq.em-acc.em-open h3::after {
	content: "\2212";
	color: #fff;
	background: var(--em-blue);
}

body.elume-modern .em-hfaq-item summary::after,
body.elume-modern .em-hfaq-item[open] summary::after {
	content: "+";
	border: 0;
	width: 28px;
	height: 28px;
	right: 20px;
	top: calc(50% - 14px);
	transform: none;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--em-font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1;
	color: var(--em-blue);
	background: rgba(0, 201, 252, 0.12);
	border-radius: 50%;
	transition: background-color 0.2s ease, color 0.2s ease;
}

body.elume-modern .em-hfaq-item[open] summary::after {
	content: "\2212";
	color: #fff;
	background: var(--em-blue);
}

/* --------------------------------------------------------------------------
   34. FAQ indicators v3: grid track for the badge — overlap impossible.
   The +/- pseudo is a static grid item in its own 28px column, not an
   absolutely positioned box floating over the heading.
   -------------------------------------------------------------------------- */

body.elume-modern .container_faq.em-acc h3 {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 28px;
	column-gap: 14px;
	align-items: center;
	padding-right: 0 !important;
}

body.elume-modern .container_faq.em-acc h3::after,
body.elume-modern .container_faq.em-acc.em-open h3::after {
	position: static;
	grid-column: 2;
	top: auto;
	right: auto;
	flex-shrink: 0;
}

body.elume-modern .em-hfaq-item summary {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 28px;
	column-gap: 14px;
	align-items: center;
	padding-right: 24px;
}

body.elume-modern .em-hfaq-item summary::after,
body.elume-modern .em-hfaq-item[open] summary::after {
	position: static;
	grid-column: 2;
	top: auto;
	right: auto;
}

/* --------------------------------------------------------------------------
   35. Mobile menu v2 (Cyrus feedback): clean toggle pill with Menu/Close
   states, and sub-menus inset off the panel edge.
   The theme's Ionicons ::before sat absolutely on top of the "Menu" text
   (and the icon font is not loaded, so it rendered as a broken glyph).
   -------------------------------------------------------------------------- */

@media only screen and (max-width: 992px) {
	body.elume-modern button.menu-toggle {
		width: auto !important;
		height: auto !important;
		display: inline-flex;
		align-items: center;
		padding: 10px 18px !important;
		font-size: 0 !important; /* hides the raw "Menu" DOM text */
		line-height: 1;
		background: var(--em-tint) !important;
		border: 1.5px solid var(--em-line);
		border-radius: 999px;
		color: var(--em-ink);
	}

	body.elume-modern button.menu-toggle::before {
		content: "\2630\00a0\00a0 Menu";
		position: static !important;
		width: auto !important;
		height: auto !important;
		display: inline !important;
		font-family: var(--em-font-display) !important;
		font-size: 14.5px !important;
		font-weight: 600;
		line-height: 1 !important;
		color: var(--em-ink);
	}

	body.elume-modern button.menu-toggle.activated,
	body.elume-modern .site-header button.menu-toggle.activated {
		border-color: var(--em-blue);
	}

	body.elume-modern button.menu-toggle.activated::before {
		content: "\2715\00a0\00a0 Close";
		color: var(--em-blue-deep);
	}

	/* Panel: balanced padding instead of the theme's lopsided 40px-left */
	body.elume-modern .nav-primary {
		padding: 10px 18px 16px !important;
	}

	body.elume-modern .genesis-nav-menu > .menu-item > a {
		padding-left: 6px;
		padding-right: 6px;
	}

	/* Sub-menus: inset card instead of hugging the left edge */
	body.elume-modern .genesis-nav-menu .sub-menu {
		margin: 4px 0 10px 14px !important;
		padding: 8px 10px !important;
		background: var(--em-tint);
		border: 1px solid var(--em-line);
		border-radius: 12px;
		box-shadow: none;
	}

	body.elume-modern .genesis-nav-menu .sub-menu a {
		padding: 11px 12px;
		font-size: 15px;
	}

	/* Dropdown chevron toggles: visible tap targets */
	body.elume-modern .sub-menu-toggle {
		color: var(--em-blue);
		border-radius: 10px;
	}
}