/*
 * RobertsPT mobile navigation (v1.0)
 * Replaces Divi's .et_mobile_menu dropdown at <=980px with a full-screen slate-green panel.
 * Progressive enhancement: Divi's own menu is only hidden once rpt-mobile-nav.js has run.
 * Tokens come from style.css (:root --rpt-*).
 */

:root {
	--rpt-mnav-bg: var(--rpt-slate, #3c4f53);
	--rpt-mnav-bg-deep: var(--rpt-slate-deep, #2a3a3d);
	--rpt-mnav-ink: var(--rpt-cream, #f7f3eb);
	--rpt-mnav-ink-soft: var(--rpt-text-dark, #d9d2c3);
	--rpt-mnav-rule: rgba(217, 210, 195, 0.16);
	--rpt-mnav-accent: var(--rpt-peach, #e8b896);
	--rpt-mnav-ease: cubic-bezier(0.7, 0, 0.2, 1);
	--rpt-mnav-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
	--rpt-mnav-z: 100000;
}

/* Box model for everything this component draws */
.rpt-mnav,
.rpt-mnav *,
.rpt-mnav-slot,
.rpt-mnav-toggle {
	box-sizing: border-box;
}

/* ---- Hide Divi's mobile menu once ours is ready ---- */
.rpt-header.rpt-mnav-ready .et_mobile_nav_menu {
	display: none !important;
}

/* ---- Toggle (hamburger -> X) ---- */
.rpt-mnav-slot {
	display: none;
	width: 48px;
	height: 48px;
	flex: 0 0 48px;
	margin-left: auto;
}

@media (max-width: 1199px) {
	.rpt-mnav-slot {
		display: block;
	}
}

.rpt-mnav-toggle {
	-webkit-appearance: none;
	appearance: none;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 14px;
	background: var(--rpt-mnav-bg);
	box-shadow: 0 6px 16px rgba(42, 58, 61, 0.22);
	color: var(--rpt-mnav-ink);
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.15s ease;
}

.rpt-mnav-toggle:active {
	transform: scale(0.94);
}

.rpt-mnav-toggle:focus-visible {
	outline: 3px solid var(--rpt-mnav-accent);
	outline-offset: 3px;
}

.rpt-mnav-toggle.is-floating {
	position: fixed;
	z-index: calc(var(--rpt-mnav-z) + 1);
}

.rpt-mnav-open .rpt-mnav-toggle {
	background: rgba(247, 243, 235, 0.1);
	box-shadow: inset 0 0 0 1px rgba(247, 243, 235, 0.22);
}

.rpt-mnav-bars {
	position: relative;
	display: block;
	width: 22px;
	height: 16px;
}

.rpt-mnav-bars i {
	position: absolute;
	right: 0;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	/* closing: un-rotate first, then spread */
	transition: top 0.18s var(--rpt-mnav-ease) 0.18s, width 0.18s var(--rpt-mnav-ease) 0.18s,
		transform 0.18s var(--rpt-mnav-ease), opacity 0.1s linear 0.18s;
}

.rpt-mnav-bars i:nth-child(1) { top: 0; width: 22px; }
.rpt-mnav-bars i:nth-child(2) { top: 7px; width: 14px; }
.rpt-mnav-bars i:nth-child(3) { top: 14px; width: 18px; }

/* opening: converge first, then rotate */
.rpt-mnav-open .rpt-mnav-bars i {
	top: 7px;
	width: 22px;
	transition: top 0.18s var(--rpt-mnav-ease), width 0.18s var(--rpt-mnav-ease),
		transform 0.22s var(--rpt-mnav-ease-out) 0.18s, opacity 0.1s linear 0.12s;
}

.rpt-mnav-open .rpt-mnav-bars i:nth-child(1) { transform: rotate(45deg); }
.rpt-mnav-open .rpt-mnav-bars i:nth-child(2) { opacity: 0; }
.rpt-mnav-open .rpt-mnav-bars i:nth-child(3) { transform: rotate(-45deg); }

/* ---- Panel ---- */
.rpt-mnav {
	position: fixed;
	inset: 0;
	z-index: var(--rpt-mnav-z);
	display: flex;
	flex-direction: column;
	color: var(--rpt-mnav-ink);
	background: linear-gradient(170deg, var(--rpt-mnav-bg) 0%, var(--rpt-mnav-bg-deep) 100%);
	clip-path: circle(0px at var(--rpt-mnav-x, 100%) var(--rpt-mnav-y, 0%));
	transition: clip-path 0.42s var(--rpt-mnav-ease);
	overscroll-behavior: contain;
	-webkit-font-smoothing: antialiased;
}

.rpt-mnav[hidden] {
	display: none !important;
}

.rpt-mnav.is-open {
	clip-path: circle(150vmax at var(--rpt-mnav-x, 100%) var(--rpt-mnav-y, 0%));
}

.rpt-mnav.is-closing {
	transition-duration: 0.3s;
}

/* Top bar mirrors the site header so the logo and X stay put */
.rpt-mnav__bar {
	position: relative;
	flex: 0 0 auto;
	height: var(--rpt-mnav-bar-h, 86px);
	border-bottom: 1px solid var(--rpt-mnav-rule);
}

.rpt-mnav__logo {
	position: absolute;
	display: block;
	width: auto;
	max-width: none;
	filter: brightness(0) invert(96%) sepia(8%) saturate(260%) hue-rotate(350deg);
}

.rpt-mnav__body {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	padding: 8px max(24px, env(safe-area-inset-right, 0px)) 24px max(24px, env(safe-area-inset-left, 0px));
}

.rpt-mnav__list,
.rpt-mnav__sublist {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rpt-mnav__item {
	border-bottom: 1px solid var(--rpt-mnav-rule);
}

/* Stagger-in */
.rpt-mnav__item,
.rpt-mnav__foot > * {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.32s ease, transform 0.42s var(--rpt-mnav-ease-out);
	transition-delay: calc(140ms + var(--i, 0) * 45ms);
}

.rpt-mnav.is-open .rpt-mnav__item,
.rpt-mnav.is-open .rpt-mnav__foot > * {
	opacity: 1;
	transform: none;
}

.rpt-mnav.is-closing .rpt-mnav__item,
.rpt-mnav.is-closing .rpt-mnav__foot > * {
	transition-delay: 0s;
	transition-duration: 0.15s;
}

.rpt-mnav__link {
	-webkit-appearance: none;
	appearance: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	min-height: 64px;
	margin: 0;
	padding: 12px 0;
	border: 0;
	background: none;
	color: var(--rpt-mnav-ink);
	font-family: var(--rpt-font-heading, 'Fraunces', Georgia, serif);
	font-size: 29px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.rpt-mnav__link:focus-visible,
.rpt-mnav__sub a:focus-visible,
.rpt-mnav__foot a:focus-visible {
	outline: 3px solid var(--rpt-mnav-accent);
	outline-offset: 4px;
	border-radius: 6px;
}

/* Carets: right for links, down for the Physical Therapy group (matches desktop nav) */
.rpt-mnav__caret {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	margin-right: -6px;
	opacity: 0.6;
	transition: opacity 0.2s ease, transform 0.3s var(--rpt-mnav-ease-out);
}

.rpt-mnav__caret svg {
	width: 18px;
	height: 18px;
}

.rpt-mnav__link:hover .rpt-mnav__caret,
.rpt-mnav__link:active .rpt-mnav__caret {
	opacity: 1;
}

a.rpt-mnav__link:active .rpt-mnav__caret {
	transform: translateX(3px);
}

.rpt-mnav__acc[aria-expanded="true"] .rpt-mnav__caret {
	opacity: 1;
	color: var(--rpt-mnav-accent);
	transform: rotate(180deg);
}

/* Current page: a small peach "ball on the lip" after the label */
.rpt-mnav__link[aria-current="page"] .rpt-mnav__label::after,
.rpt-mnav__acc.is-current .rpt-mnav__label::after {
	content: "";
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-left: 10px;
	vertical-align: 0.3em;
	border-radius: 50%;
	background: var(--rpt-mnav-accent);
}

/* Accordion body: animates height via grid rows */
.rpt-mnav__sub {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.36s var(--rpt-mnav-ease);
}

.rpt-mnav__sub.is-open {
	grid-template-rows: 1fr;
}

.rpt-mnav__sub > div {
	min-height: 0;
	overflow: hidden;
}

.rpt-mnav__subinner {
	display: grid;
	gap: 4px;
	padding: 0 0 20px;
}

.rpt-mnav__overview {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	color: var(--rpt-mnav-accent);
	font-family: var(--rpt-font-body, 'Hanken Grotesk', system-ui, sans-serif);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
}

.rpt-mnav__sublist {
	display: grid;
	gap: 0;
}

.rpt-mnav__sub a:not(.rpt-mnav__overview) {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 4px 0;
	color: var(--rpt-mnav-ink);
	font-family: var(--rpt-font-body, 'Hanken Grotesk', system-ui, sans-serif);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	text-decoration: none;
}

.rpt-mnav__sub a[aria-current="page"] {
	color: var(--rpt-mnav-accent);
}

/* ---- Footer: CTA + contact ---- */
.rpt-mnav__foot {
	flex: 0 0 auto;
	display: grid;
	gap: 12px;
	padding: 16px max(24px, env(safe-area-inset-right, 0px)) max(20px, env(safe-area-inset-bottom, 0px)) max(24px, env(safe-area-inset-left, 0px));
	border-top: 1px solid var(--rpt-mnav-rule);
	background: rgba(42, 58, 61, 0.55);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* Compact primary CTA: same size and wording as the sticky bar */
.rpt-mnav__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--rpt-tap-min, 48px);
	padding: 12px 16px;
	border-radius: var(--rpt-radius-sm, 10px);
	background: var(--rpt-copper, #a15b32);
	color: #fff;
	font-family: var(--rpt-font-body, 'Hanken Grotesk', system-ui, sans-serif);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	text-align: center;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color 0.2s ease, transform 0.15s ease;
}

.rpt-mnav__cta:hover,
.rpt-mnav__cta:active {
	background: var(--rpt-copper-hover, #86471f);
}

.rpt-mnav__cta:active {
	transform: scale(0.985);
}

.rpt-mnav__contact {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 16px;
	color: var(--rpt-mnav-ink-soft);
	font-family: var(--rpt-font-body, 'Hanken Grotesk', system-ui, sans-serif);
	font-size: 14px;
	line-height: 1.4;
}

.rpt-mnav__contact a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	color: var(--rpt-mnav-ink);
	font-weight: 600;
	text-decoration: none;
}

.rpt-mnav__contact svg {
	width: 16px;
	height: 16px;
	opacity: 0.8;
}

/* ---- Page state while open ---- */
html.rpt-mnav-lock,
html.rpt-mnav-lock body {
	overflow: hidden !important;
}

.rpt-mnav-open .rpt-sticky-cta {
	opacity: 0 !important;
	pointer-events: none !important;
	transform: translateY(16px);
	transition: opacity 0.2s ease, transform 0.2s ease;
}

/* ---- Hero CTA on phones: compact, one line, identical to the sticky bar ---- */
@media (max-width: 820px) {
	.rpt-hero .et_pb_button.et_pb_button {
		display: flex !important;
		box-sizing: border-box;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-height: var(--rpt-tap-min, 48px);
		padding: 12px 16px !important;
		border-radius: var(--rpt-radius-sm, 10px) !important;
		font-size: 15px !important;
		font-weight: 700 !important;
		line-height: 1.25 !important;
		white-space: nowrap;
	}

	.rpt-hero .et_pb_button.et_pb_button::before,
	.rpt-hero .et_pb_button.et_pb_button::after {
		display: none !important;
	}
}

/*
 * ---- Sticky CTA: one primary CTA on screen at a time ----
 * Hidden while the hero CTA (or the final CTA band) is visible. Once those leave the
 * viewport and scrolling stops, it rises into place and stays. Only applies once JS runs.
 */
html.rpt-sticky-js .rpt-sticky-cta {
	transform: translateY(calc(100% + 12px));
	visibility: hidden;
	transition: transform 0.32s var(--rpt-mnav-ease), visibility 0s linear 0.32s;
	will-change: transform;
}

html.rpt-sticky-js .rpt-sticky-cta.is-visible {
	transform: none;
	visibility: visible;
	transition: transform 0.48s cubic-bezier(0.22, 1.2, 0.36, 1), visibility 0s;
}

/* ---- Reduced motion: fades only ---- */
@media (prefers-reduced-motion: reduce) {
	.rpt-mnav {
		clip-path: none;
		opacity: 0;
		transition: opacity 0.16s linear;
	}

	.rpt-mnav.is-open {
		clip-path: none;
		opacity: 1;
	}

	.rpt-mnav__item,
	.rpt-mnav__foot > *,
	.rpt-mnav-bars i,
	.rpt-mnav__sub,
	.rpt-mnav__caret {
		transition-duration: 0.01ms !important;
		transition-delay: 0s !important;
	}

	.rpt-mnav__item,
	.rpt-mnav__foot > * {
		transform: none !important;
	}

	html.rpt-sticky-js .rpt-sticky-cta {
		transform: none;
		opacity: 0;
		transition: opacity 0.2s linear, visibility 0s linear 0.2s;
	}

	html.rpt-sticky-js .rpt-sticky-cta.is-visible {
		opacity: 1;
		transition: opacity 0.2s linear, visibility 0s;
	}
}

/*
 * ---- Header at tablet and narrow desktop (<=1199px) ----
 * The desktop nav, logo and CTA need about 1200px. Below that the hamburger takes over (Divi's own switch is
 * at 980, so the desktop nav is hidden here once the script is ready). Logo on the left; on the right the
 * CTA, then the menu toggle as the last element. The script moves the toggle into the CTA column.
 * The logo never shrinks horizontally. Under 820px the header CTA is hidden (the sticky bar takes over).
 */
.rpt-header .et_pb_menu__logo-wrap,
.rpt-header .et_pb_menu__logo {
	flex: 0 0 auto;
}

.rpt-header .et_pb_menu__logo img {
	width: auto;
	max-width: none;
	flex: 0 0 auto;
}

@media (max-width: 1199px) {
	.rpt-header.rpt-mnav-ready .et_pb_menu__menu,
	.rpt-header.rpt-mnav-ready .et-menu-nav {
		display: none !important;
	}

	.rpt-header.rpt-mnav-ready .rpt-header-cta {
		display: flex !important;
		align-items: center;
		justify-content: flex-end;
		gap: 12px;
	}

	.rpt-header.rpt-mnav-ready .rpt-header-cta .rpt-mnav-slot {
		margin-left: 0;
	}
}

@media (max-width: 820px) {
	.rpt-header.rpt-mnav-ready .rpt-header-cta .et_pb_button_module_wrapper {
		display: none;
	}
}
