/* ============================================================
   Migration visual fixes (Squarespace -> WP).
   Restores the visible layer (video/image section backgrounds)
   that Squarespace's runtime JS used to build.

   NOTE: in this imported markup, a CSS background-image on
   .section-background does not paint reliably, but the .page-section
   element itself paints fine. So hero backgrounds are applied to the
   section element, and the inner slate layers are made transparent.
   ============================================================ */

/* ---- Section-divider clipPath fix ----
   Sections with class="has-section-divider" get
     .section-border { transform: ...; clip-path: url(#section-divider-XXX); }
   from Squarespace's CSS. The referenced <clipPath> is defined inline
   inside the section with path d="M0,0" (a single point). Squarespace's
   runtime JS computes the actual divider curve at load time and rewrites
   that d attribute; the import strips that JS, so d stays at "M0,0" and
   clip-path clips the entire .section-border (and everything inside it,
   including the hero <video>) to a zero-area region. Result: hero videos
   are invisible while the section's outer background-image still paints.
   Disable the clip-path + identity-transform so the section-border + its
   contents (video, bg image) render. We lose the divider stroke visual,
   but the hero comes back. */
.page-section .section-border {
	transform: none !important;
	clip-path: none !important;
}

/* ---- Native video backgrounds (home hero etc.) ---- */
.section-background .video-background { position: absolute; inset: 0; overflow: hidden; }
.section-background .video-background__player,
.section-background video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---- Home hero ----
   Cap the video layer only (.section-background / .section-border) to 80vh
   so the 1280x720 mp4 plays at native resolution instead of being upscaled
   into mush. The SECTION itself stays at natural height because the imported
   Squarespace fluid-engine absolute-positions H1+sub+CTA based on the
   original tall layout and depends on the scaled-text JS reading a real
   container width; touching it breaks the headline. Below the capped video
   we paint a solid color overlay matching the section's color theme so the
   poster image doesn't visibly tile below the video. */
.home .page-section:first-of-type {
	position: relative;
	min-height: 80vh;
	background-image: url('/wp-content/uploads/sites/2/squarespace-video/hero-poster.webp');
	background-size: cover;
	background-position: center 45%;
}
.home .page-section:first-of-type .section-background,
.home .page-section:first-of-type .section-border {
	height: 80vh !important;
	max-height: 720px !important;
	bottom: auto !important;
}
/* Hide the poster background below the video. Solid color matches the
   section's data-section-theme bg color (rgb(123,148,156)) so the section
   reads as one coherent block under the video instead of a static poster. */
.home .page-section:first-of-type::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: min(80vh, 720px);
	bottom: 0;
	background: rgb(123, 148, 156);
	z-index: 1;
	pointer-events: none;
}
/* But keep the fluid-engine content (H1 + sub + CTA) painted ABOVE the
   overlay so they remain visible. */
.home .page-section:first-of-type .content-wrapper {
	position: relative;
	z-index: 5;
}
.home .page-section:first-of-type .sqs-video-background-native { background: transparent !important; }

/* ---- Interior page heroes ----
   All interior pages share one Squarespace hero image that did not migrate;
   it's now restored. Image + scrim go on the section element; the slate
   .section-border / .section-background layers are cleared so they don't
   cover it. Pages that kept their own <img> hero still show it (the <img>
   renders on top of this background). */
body:not(.home) .page-section:first-of-type {
	position: relative;
	min-height: 44vh;
	background-image:
		linear-gradient(180deg, rgba(18, 31, 46, .42), rgba(18, 31, 46, .58)),
		url('/wp-content/uploads/sites/2/2026/05/unsplash-image-lECj_ApWuVs.webp');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
body:not(.home) .page-section:first-of-type .section-border,
body:not(.home) .page-section:first-of-type .section-background {
	background-color: transparent !important;
}

/* Headline + copy readable over hero media (home + interior) */
.home .page-section:first-of-type h1,
.home .page-section:first-of-type h2,
.home .page-section:first-of-type h3,
.home .page-section:first-of-type h4,
.home .page-section:first-of-type p,
.home .page-section:first-of-type li,
body:not(.home) .page-section:first-of-type h1,
body:not(.home) .page-section:first-of-type h2,
body:not(.home) .page-section:first-of-type h3,
body:not(.home) .page-section:first-of-type h4,
body:not(.home) .page-section:first-of-type p,
body:not(.home) .page-section:first-of-type li {
	color: #fff !important;
	text-shadow: 0 1px 14px rgba(0, 0, 0, .45);
}

/* Squarespace gallery thumbnail-nav strip: the thumbnail-sized files were not
   migrated and the gallery JS isn't present, so this strip is just broken
   images. The main gallery renders fine; hide the dead nav strip. */
.sqs-gallery-thumbnails { display: none !important; }

/* Brand pill CTA. The transformer rewrites every imported "Find your next step"
   button + SimplePractice anchor into <a class="lw-cta" href="/contact/">. Style
   it as an ink pill so it reads as the primary action on the page. */
.lw-cta,
.sqs-block-button-element--primary,
.sqs-block-button-element {
	display: inline-block;
	padding: 14px 30px;
	background: #181F2E !important;
	background-image: none !important;
	color: #fff !important;
	text-decoration: none !important;
	border: none !important;
	border-radius: 999px !important;
	box-shadow: none !important;
	font-family: 'Nunito Sans', sans-serif !important;
	font-weight: 600;
	line-height: 1.2;
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.lw-cta:hover,
.sqs-block-button-element--primary:hover,
.sqs-block-button-element:hover {
	background: #2C3654 !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(24, 31, 46, .22) !important;
	color: #fff !important;
}

/* ============================================================
   Home contact / locations section (rebuilt; see inc/home-contact-section.php)
   ============================================================ */
/* Bright footer (rebuilt 2026-05-30). The site is cream everywhere, so the old
   night-sky dark block was scrapped for a light, airy footer: cream field, ochre
   top rule, the black LiveWell mark, moss section labels, ochre hover. */
.lw-footer {
	background: #F6F1E1;
	border-top: 3px solid #D9A648;
	color: #4A463F;
	padding: 60px 24px 44px;
}
.lw-footer__inner {
	max-width: 1200px; margin: 0 auto;
	display: grid;
	grid-template-columns: 1.7fr 1fr 1fr 1fr;
	gap: 48px;
	align-items: start;
}
.lw-footer__logo { width: 132px; height: auto; display: block; margin: 0 0 18px; }
.lw-footer__tag { font-size: .98rem; line-height: 1.65; color: #4A463F; max-width: 36ch; margin: 0 0 22px; }
.lw-footer__socials { display: flex; gap: 12px; }
.lw-footer__socials a {
	width: 40px; height: 40px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	color: #2B3A2E; background: #FDF8E8; border: 1px solid #E2D6B8;
	text-decoration: none;
	transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.lw-footer__socials a:hover { background: #2B3A2E; color: #FDF8E8; border-color: #2B3A2E; transform: translateY(-2px); }
.lw-footer__h {
	font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .15em;
	color: #2B3A2E; margin: 0 0 14px;
}
.lw-footer__h--gap { margin-top: 28px; }
.lw-footer__col p { margin: 0 0 16px; line-height: 1.7; font-size: .95rem; color: #4A463F; }
.lw-footer__addr strong { display: block; color: #181F2E; font-weight: 700; margin-bottom: 2px; }
.lw-footer a { color: #2B3A2E; text-decoration: none; border-bottom: 1px solid transparent; transition: color .15s ease, border-color .15s ease; }
.lw-footer__col a:hover { color: #181F2E; border-bottom-color: #D9A648; }
.lw-footer__links { list-style: none; margin: 0; padding: 0; }
.lw-footer__links li { margin: 0 0 11px; }
.lw-footer__apps { display: flex; gap: 10px; flex-wrap: wrap; }
.lw-footer__app {
	padding: 8px 20px; border-radius: 999px; font-weight: 600; font-size: .9rem;
	color: #2B3A2E; background: #FDF8E8;
	border: 1px solid #CFC0A0; border-bottom-color: #CFC0A0;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.lw-footer__app:hover { background: #2B3A2E; color: #FDF8E8; border-color: #2B3A2E; }
@media (max-width: 900px) {
	.lw-footer__inner { grid-template-columns: 1fr 1fr; gap: 36px 32px; }
	.lw-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
	.lw-footer { padding: 48px 22px 36px; }
	.lw-footer__inner { grid-template-columns: 1fr; gap: 30px; }
}
.lw-contact__connect { margin-top: 28px !important; padding-top: 18px !important; }

/* ---- New home v2/v3 elements ---- */
/* Wellness scroll-snap carousel */
.lw-carousel {
	display: flex;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	padding: 2rem 1.5rem 1.5rem;
	margin-top: 2.5rem;
	scrollbar-width: thin;
}
.lw-carousel::-webkit-scrollbar { height: 8px; }
.lw-carousel::-webkit-scrollbar-thumb { background: rgba(24,31,46,.25); border-radius: 4px; }
.lw-carousel__slide {
	scroll-snap-align: start;
	flex: 0 0 320px;
	height: 380px;
	border-radius: 16px;
	background-size: cover;
	background-position: center;
	color: #fff;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 1.5rem;
	transition: transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 6px 22px rgba(24,31,46,.18);
}
.lw-carousel__slide:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 34px rgba(24,31,46,.28);
	color: #fff;
}
.lw-carousel__eyebrow {
	display: block;
	font-size: .8rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	opacity: .8;
	margin-bottom: .35rem;
}
.lw-carousel__title {
	display: block;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.15;
}
@media (max-width: 600px) {
	.lw-carousel__slide { flex: 0 0 86vw; height: 320px; }
}

/* Condition card hover */
.lw-condition-card {
	transition: transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 2px 12px rgba(24,31,46,.08);
}
.lw-condition-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(24,31,46,.18);
}
.lw-condition-card a { text-decoration: none; color: inherit; }
.lw-condition-card a:hover h3 { color: #536B7A; }
.lw-condition-card img { display: block; width: 100%; height: 180px; object-fit: cover; }

/* Fine Print accordion */
.lw-faq__item {
	border-top: 1px solid rgba(24,31,46,.12);
	padding: 1.1rem 0;
}
.lw-faq__item:last-child { border-bottom: 1px solid rgba(24,31,46,.12); }
.lw-faq__item summary {
	cursor: pointer;
	font-weight: 600;
	font-size: 1.05rem;
	color: #181F2E;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.lw-faq__item summary::-webkit-details-marker { display: none; }
.lw-faq__item summary::after {
	content: "+";
	font-size: 1.5rem;
	font-weight: 300;
	color: #536B7A;
	transition: transform .2s ease;
}
.lw-faq__item[open] summary::after {
	content: "−";
}
.lw-faq__item p, .lw-faq__item ul { margin: .9rem 0; line-height: 1.6; color: #3D5260; }
.lw-faq__item ul { padding-left: 1.5rem; }

/* Testimonial video */
.lw-testimonial-video {
	box-shadow: 0 8px 26px rgba(24,31,46,.18);
}

/* ---- v4: Trust strip (under hero) ---- */
.lw-trust-strip {
	background: #181F2E;
	color: #FDF8E8;
	padding: 1.25rem 1.5rem;
}
.lw-trust-strip__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	text-align: center;
}
.lw-trust-item {
	display: flex;
	flex-direction: column;
	gap: .2rem;
	padding: 0 .5rem;
}
.lw-trust-item strong {
	font-weight: 700;
	font-size: .95rem;
	letter-spacing: .01em;
}
.lw-trust-item span {
	font-size: .82rem;
	opacity: .7;
}
@media (max-width: 900px) {
	.lw-trust-strip__inner { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.lw-trust-strip__inner { grid-template-columns: 1fr; }
}

/* ---- v4: How it works ---- */
.lw-how {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
	margin-top: 3rem;
}
.lw-how__step {
	background: #fff;
	border: 1px solid #ECE6D6;
	border-radius: 16px;
	padding: 2rem 1.75rem;
	position: relative;
	transition: transform .2s ease, box-shadow .2s ease;
}
.lw-how__step:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(24,31,46,.12);
}
.lw-how__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #181F2E;
	color: #fff;
	border-radius: 50%;
	font-weight: 700;
	font-size: 1.2rem;
	margin-bottom: 1.25rem;
}
.lw-how__step h3 {
	font-size: 1.2rem;
	font-weight: 600;
	margin: 0 0 .65rem;
	color: #181F2E;
}
.lw-how__step p {
	margin: 0;
	color: #3D5260;
	line-height: 1.55;
	font-size: .98rem;
}
@media (max-width: 781px) {
	.lw-how { grid-template-columns: 1fr; }
}

/* ---- v4: Condition cards (image on top + body below) ---- */
.lw-cond-card {
	display: flex;
	flex-direction: column;
	border-radius: 14px;
	overflow: hidden;
	color: #181F2E;
	text-decoration: none;
	background: #fff;
	transition: transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 4px 14px rgba(24,31,46,.10);
}
.lw-cond-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 32px rgba(24,31,46,.20);
	color: #181F2E;
}
.lw-cond-card__img {
	display: block;
	width: 100%;
	height: 200px;
	background-size: cover;
	background-position: center;
}
.lw-cond-card__body {
	display: flex;
	flex-direction: column;
	gap: .55rem;
	padding: 1.4rem 1.4rem 1.5rem;
	flex: 1;
}
.lw-cond-card__name {
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: -0.01em;
}
.lw-cond-card__desc {
	font-size: .95rem;
	line-height: 1.5;
	color: #3D5260;
	flex: 1;
}
.lw-cond-card__arrow {
	font-size: 1.4rem;
	font-weight: 300;
	color: #536B7A;
	align-self: flex-end;
}

/* Fine Print: narrower for readability */
.lw-faq-section .lw-faq { max-width: 640px; margin-left: auto; margin-right: auto; }

/* ---- v4: Team grid ---- */
.lw-team {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	margin-top: 2.5rem;
}
.lw-team__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	background: #fff;
	border-radius: 16px;
	padding: 1.75rem 1.25rem 1.5rem;
	text-decoration: none;
	color: #181F2E;
	transition: transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 2px 10px rgba(24,31,46,.08);
}
.lw-team__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(24,31,46,.16);
	color: #181F2E;
}
.lw-team__card img {
	width: 130px;
	height: 130px;
	border-radius: 50%;
	object-fit: cover;
	margin-bottom: 1rem;
	background: #ECE6D6;
}
.lw-team__card h3 {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0 0 .25rem;
}
.lw-team__cred {
	font-size: .82rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #536B7A;
	font-weight: 600;
	display: block;
	margin-bottom: .35rem;
}
.lw-team__role {
	font-size: .9rem;
	color: #3D5260;
	line-height: 1.4;
	display: block;
}
@media (max-width: 900px) {
	.lw-team { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.lw-team { grid-template-columns: 1fr; }
}
/* (old dark .lw-contact__* footer styles removed; replaced by .lw-footer above) */

/* Instagram block: the original Squarespace gallery can't load (its JS is
   stripped), so hide it and let the injected Smash Balloon feed (#sb_instagram)
   render in its place. */
.sqs-block-instagram > .sqs-block-content { display: none !important; }
.sqs-block-instagram #sb_instagram { display: block !important; }

/* ============================================================
   Squarespace image-backed section backgrounds.
   Squarespace hides these <img>s until its loader JS adds a `loaded` class
   (stripped on import), and they default to in-flow position. Reveal them and
   make them cover the section as a true background. Per-image object-position
   (focal point) is preserved via the inline style Squarespace set.
   ============================================================ */
.page-section .section-background img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	visibility: visible !important;
	opacity: 1 !important;
	display: block !important;
}

/* Some sections (e.g. the one hosting the Instagram feed) nest such that the
   absolutely-positioned .section-background paints BEHIND the page's white
   background and the theme color never shows. Paint each section's theme color
   directly on the .page-section element (which always renders); image/video
   backgrounds in .section-background sit on top of it, so they are unaffected. */
.page-section[data-section-theme] { background-color: var(--siteBackgroundColor); }

/* ---- About page: WHO/WHAT/WHY trio cards (also used on other index pages) ---- */
.lw-trio {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}
.lw-trio__card {
	display: flex;
	flex-direction: column;
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: #181F2E;
	background: #fff;
	box-shadow: 0 4px 14px rgba(24,31,46,.10);
	transition: transform .2s ease, box-shadow .2s ease;
}
.lw-trio__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px rgba(24,31,46,.22);
	color: #181F2E;
}
.lw-trio__img {
	display: block;
	width: 100%;
	height: 220px;
	background-size: cover;
	background-position: center;
}
.lw-trio__body {
	padding: 1.5rem 1.5rem 1.6rem;
	display: flex;
	flex-direction: column;
	gap: .55rem;
}
.lw-trio__eyebrow {
	font-size: .8rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #536B7A;
	font-weight: 700;
}
.lw-trio__title {
	font-size: 1.3rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
}
.lw-trio__cta {
	font-size: .95rem;
	color: #181F2E;
	font-weight: 600;
	margin-top: .35rem;
}
@media (max-width: 900px) {
	.lw-trio { grid-template-columns: 1fr; }
	.lw-trio__img { height: 200px; }
}

/* ---- Services grid (What We Do): 3-up image cards ---- */
.lw-services-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}
.lw-svc-card {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 360px;
	padding: 1.75rem;
	border-radius: 16px;
	color: #fff;
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease;
	box-shadow: 0 6px 22px rgba(24,31,46,.18);
}
.lw-svc-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px rgba(24,31,46,.28);
	color: #fff;
}
.lw-svc__eyebrow {
	display: block;
	font-size: .78rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	opacity: .85;
	margin-bottom: .5rem;
	font-weight: 700;
}
.lw-svc__title {
	display: block;
	font-size: 1.45rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
	margin-bottom: .55rem;
}
.lw-svc__desc {
	display: block;
	font-size: .95rem;
	line-height: 1.5;
	opacity: .9;
}
.lw-services-grid--4 { grid-template-columns: repeat(4, 1fr); }
.lw-services-grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 1100px) {
	.lw-services-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
	.lw-services-grid, .lw-services-grid--4, .lw-services-grid--2 { grid-template-columns: 1fr; }
	.lw-svc-card { min-height: 260px; }
}

/* ---- GRIT explainer cards (Core Values page) ---- */
.lw-grit-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}
.lw-grit-card {
	background: #fff;
	border-radius: 16px;
	padding: 2rem 1.5rem;
	border: 1px solid #ECE6D6;
	display: flex;
	flex-direction: column;
	gap: .65rem;
	transition: transform .2s ease, box-shadow .2s ease;
}
.lw-grit-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(24,31,46,.12);
}
.lw-grit-letter {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	background: #181F2E;
	color: #fff;
	border-radius: 50%;
	font-weight: 800;
	font-size: 1.9rem;
	letter-spacing: -0.04em;
	margin-bottom: .35rem;
}
.lw-grit-name {
	font-size: 1.3rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #181F2E;
}
.lw-grit-card p {
	margin: 0;
	font-size: .95rem;
	line-height: 1.55;
	color: #3D5260;
}
@media (max-width: 900px) {
	.lw-grit-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.lw-grit-grid { grid-template-columns: 1fr; }
}

/* ---- Insurance pills ---- */
.lw-insurance-list {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	margin: 1.5rem auto;
	max-width: 720px;
}
.lw-ins-pill {
	display: inline-block;
	padding: .55rem 1rem;
	background: #fff;
	border: 1px solid #181F2E;
	border-radius: 999px;
	font-size: .9rem;
	font-weight: 600;
	color: #181F2E;
}
/* Insurance tiers: preferred networks read loud, the rest read quiet. */
.lw-ins-tier__label {
	text-transform: uppercase; letter-spacing: .14em;
	font-size: .76rem; font-weight: 700; color: #2B3A2E;
	margin: 1.4rem auto .2rem; max-width: 720px;
}
.lw-ins-pill--preferred {
	background: #2B3A2E; color: #F5EFE4; border-color: #2B3A2E;
	font-weight: 700; font-size: 1.02rem; padding: .7rem 1.25rem;
	box-shadow: 0 6px 18px rgba(43,58,46,.22);
}
.lw-insurance-list--muted { gap: .45rem; margin-top: .4rem; }
.lw-insurance-list--muted .lw-ins-pill {
	background: transparent; border-color: #C9C0AC; color: #6B6356;
	font-size: .82rem; font-weight: 500; padding: .35rem .8rem;
}

/* Slim footer: the rich contact/locations block (.lw-contact) now carries the
   address/social/nav, so the footer is just a copyright + legal bar. */
.site-footer--slim { background: #EFE7D2; color: #6F6857; padding: 0; }
.site-footer--slim .site-footer__inner { max-width: 1200px; margin: 0 auto; padding: 18px 24px; }
.site-footer--slim .site-footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; font-size: .85rem; padding-top: 0; border-top: 0; opacity: 1; }
.site-footer--slim a { color: #5A5446; margin-left: 16px; text-decoration: none; border-bottom: 1px solid transparent; transition: color .15s ease, border-color .15s ease; }
.site-footer--slim a:hover { color: #2B3A2E; border-bottom-color: #D9A648; }
@media (max-width: 600px){ .site-footer--slim .site-footer__bottom { flex-direction: column; text-align: center; } .site-footer--slim a{margin:0 8px;} }

/* ============================================================
   Card-grid uniform-height fix
   ------------------------------------------------------------
   wp-block-columns ships with align-items:normal which keeps each
   column's content at its intrinsic height: a column with 3 lines of
   prose stops short of one with 6, and the row gets visual noise from
   misaligned card bottoms (insurance pricing tiers are the canonical
   example of this on the site). Force the columns to stretch and
   every direct group child to fill its column.
   ============================================================ */
.wp-block-columns:not(.is-not-stacked-on-mobile) {
	align-items: stretch !important;
}
.wp-block-columns > .wp-block-column {
	display: flex;
}
.wp-block-columns > .wp-block-column > .wp-block-group,
.wp-block-columns > .wp-block-column > .wp-block-cover {
	width: 100%;
	display: flex;
	flex-direction: column;
}
/* Bordered card groups inside columns: fill the column height so the
   bottom border lines up across the row. */
.wp-block-columns > .wp-block-column > .wp-block-group.has-border-color,
.wp-block-columns > .wp-block-column > .wp-block-group.has-background {
	flex: 1;
}

/* ============================================================
   Softer page background
   ------------------------------------------------------------
   The original cream (#FDF8E8) reads as "caustic light" against long
   stretches of black body text. Shift the on-page card / section
   backgrounds toward a lower-saturation warm off-white that lowers
   glare without losing the brand cream. Only targets the page-wrapper
   surface, not the brand-cream accent strips inside section blocks
   (those keep #FDF8E8 by inline style).
   ============================================================ */
body, .site, main#main {
	background-color: #F6F1E1;
}
/* Section blocks that the page author set to cream (#FDF8E8 inline)
   stay at brand cream so the rhythm of warm-cream strips alternating
   with white card rows remains. */

/* ============================================================
   Editorial prose constraint (no walls of text)
   ------------------------------------------------------------
   When a wp-block-group sets its content-size to 760-800px (the wide
   manifesto sections), keep the prose inside readable line-length AND
   give it more breathing margins. This catches the long paragraph runs
   on /who-we-are/, /what-we-do/, /about/, etc.
   ============================================================ */
.wp-block-group.is-layout-constrained > p {
	margin-left: auto;
	margin-right: auto;
}
@media (min-width: 768px) {
	.wp-block-group.is-layout-constrained[style*="contentSize:760"],
	.wp-block-group.is-layout-constrained[style*="contentSize: 760"] {
		max-width: 640px !important;
	}
}

/* ============================================================
   Common Medications panel (condition pages)
   ------------------------------------------------------------
   Renders right before the dig-deeper block. Moss background to
   match the rhythm of the page; cards in a 2-column grid that
   collapses to 1 on mobile. Each card is an outbound link to the
   medication's psychiatry.help canonical, deliberately structured
   so Google reads it as topical depth + obvious cross-reference.
   ============================================================ */
.lw-meds-panel {
	background: #2B3A2E;
	color: #FDF8E8;
	padding: 4rem 1.5rem;
}
.lw-meds-panel__inner {
	max-width: 1100px;
	margin: 0 auto;
}
.lw-meds-panel__eyebrow {
	font-size: .82rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 700;
	color: #E9D8A6;
	margin: 0 0 1rem;
	text-align: center;
}
.lw-meds-panel__lead {
	font-size: 1.05rem;
	line-height: 1.6;
	max-width: 640px;
	margin: 0 auto 2.5rem;
	text-align: center;
	color: rgba(253,248,232,.86);
}
.lw-meds-panel__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
@media (max-width: 720px) {
	.lw-meds-panel__list { grid-template-columns: 1fr; }
}
.lw-meds-panel__card { margin: 0; }
.lw-meds-panel__link {
	display: flex;
	flex-direction: column;
	gap: .35rem;
	background: rgba(253,248,232,.06);
	border: 1px solid rgba(253,248,232,.18);
	border-radius: 12px;
	padding: 1.25rem 1.4rem;
	color: #FDF8E8;
	text-decoration: none;
	height: 100%;
	transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.lw-meds-panel__link:hover {
	transform: translateY(-2px);
	background: rgba(253,248,232,.12);
	border-color: rgba(233,216,166,.55);
	color: #FDF8E8;
}
.lw-meds-panel__name {
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: -0.01em;
}
.lw-meds-panel__generic {
	font-size: .95rem;
	font-weight: 400;
	color: rgba(253,248,232,.7);
}
.lw-meds-panel__note {
	font-size: .95rem;
	line-height: 1.5;
	color: rgba(253,248,232,.86);
	margin-top: .2rem;
}
.lw-meds-panel__cta {
	font-size: .8rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 700;
	color: #E9D8A6;
	margin-top: .4rem;
}
.lw-meds-panel__footer {
	margin: 2rem 0 0;
	text-align: center;
	font-size: .9rem;
	color: rgba(253,248,232,.7);
}
.lw-meds-panel__footer a {
	color: #E9D8A6;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}
.lw-meds-panel__footer a:hover { color: #FDF8E8; }

/* ============================================================
   Reusable patient testimonial block (condition + service pages)
   ------------------------------------------------------------
   Renders below the meds panel and above dig-deeper. 3-up card row
   on desktop, collapses to single column on mobile. The cards have
   a paper-cream background to match the brand and a subtle ink
   border so they sit clearly on the page-bg cream.
   ============================================================ */
.lw-testimonials {
	padding: 5rem 1.5rem;
	background: #FDF8E8;
}
.lw-testimonials__inner {
	max-width: 1180px;
	margin: 0 auto;
}
.lw-testimonials__eyebrow {
	text-align: center;
	margin: 0 0 .75rem;
	font-size: .82rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 700;
	color: #536B7A;
}
.lw-testimonials__heading {
	text-align: center;
	font-size: clamp(1.8rem, 3.5vw, 2.6rem);
	font-weight: 500;
	margin: 0 0 3rem;
	color: #181F2E;
	letter-spacing: -0.01em;
}
.lw-testimonials__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}
@media (max-width: 900px) {
	.lw-testimonials__list { grid-template-columns: 1fr; gap: 1rem; }
}
.lw-testimonials__card {
	background: #fff;
	border: 1px solid rgba(24,31,46,.12);
	border-radius: 14px;
	padding: 1.75rem 1.5rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-shadow: 0 2px 8px rgba(24,31,46,.06);
}
.lw-testimonials__quote {
	margin: 0 0 1.4rem;
	padding: 0;
	font-size: 1rem;
	line-height: 1.55;
	color: #181F2E;
	border-left: none;
	quotes: "\201C" "\201D";
}
.lw-testimonials__quote::before { content: open-quote; margin-right: .15rem; color: #536B7A; }
.lw-testimonials__quote::after  { content: close-quote; margin-left: .15rem;  color: #536B7A; }
.lw-testimonials__attribution {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-top: auto;
}
.lw-testimonials__avatar {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: #2B3A2E;
	color: #FDF8E8;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 1rem;
}
.lw-testimonials__name {
	font-size: .92rem;
	font-weight: 600;
	color: #3D5260;
	letter-spacing: .01em;
}

/* ============================================================
   Floating contact button (desktop + mobile, all pages but /contact/)
   ------------------------------------------------------------
   Pinned bottom-LEFT so it doesn't collide with the Smash Balloon
   wpchat livechat bubble that sits bottom-right. Two CTAs are good
   (chat for quick Qs, pill for full intake) as long as they're not
   visually smooshed together. On mobile the pill shrinks to an
   icon-only circle. Body gets bottom padding when the mobile sticky
   CTA bar is active so this floating button doesn't overlap it.
   ============================================================ */
/* The floating pill carries .lw-cta so the modal handler picks it up,
   but .lw-cta has background:#181F2E !important (ink) which would turn
   the pill stone-grey. Override with explicit moss + !important so the
   floating button stays brand-correct. */
.lw-floating-cta,
.lw-floating-cta.lw-cta {
	position: fixed;
	left: 20px;
	bottom: 22px;
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	padding: .8rem 1.15rem;
	background: #2B3A2E !important;
	color: #FDF8E8 !important;
	font-weight: 700;
	font-size: .92rem;
	letter-spacing: .01em;
	text-decoration: none;
	border-radius: 999px;
	box-shadow: 0 10px 30px rgba(24,31,46,.22);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
	z-index: 9000;
}
.lw-floating-cta:hover,
.lw-floating-cta.lw-cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 40px rgba(24,31,46,.32) !important;
	background: #1F2C22 !important;
	color: #FDF8E8 !important;
}
.lw-floating-cta svg { display: block; }
@media (max-width: 720px) {
	.lw-floating-cta {
		bottom: 88px;
		left: 14px;
		padding: .85rem;
		border-radius: 50%;
	}
	.lw-floating-cta__label { display: none; }
}

/* "Text us" floating button. Replaces the old third-party live-chat bubble
   (deactivated for HIPAA + brand reasons); taps open the phone's SMS
   composer to the clinic's registered 10DLC line. Bottom-right so it doesn't
   collide with the bottom-left contact-form CTA. */
.lw-floating-text {
	position: fixed;
	right: 20px;
	bottom: 22px;
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	padding: .8rem 1.15rem;
	background: #D9A648;
	color: #1A1715;
	font-weight: 700;
	font-size: .92rem;
	text-decoration: none;
	border-radius: 999px;
	box-shadow: 0 10px 30px rgba(24,31,46,.22);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
	z-index: 9000;
}
.lw-floating-text:hover {
	transform: translateY(-2px);
	background: #cf9a35;
	color: #1A1715;
	box-shadow: 0 14px 40px rgba(24,31,46,.32);
}
.lw-floating-text svg { display: block; }
@media (max-width: 720px) {
	.lw-floating-text {
		bottom: 88px;
		right: 14px;
		padding: .85rem;
		border-radius: 50%;
	}
	.lw-floating-text__label { display: none; }
}

/* ============================================================
   Mobile sticky CTA bar (condition + service pages)
   ------------------------------------------------------------
   Pinned to the bottom of mobile viewports so the conversion CTA is
   always within thumb reach. Hidden on desktop (the floating button
   covers it there). The body needs ~76px bottom padding when the bar
   is present so the floating button + page footer don't overlap.
   ============================================================ */
.lw-sticky-cta {
	display: none;
}
@media (max-width: 720px) {
	.lw-sticky-cta {
		display: block;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		padding: .65rem .85rem env(safe-area-inset-bottom, .65rem);
		background: rgba(253,248,232,.97);
		backdrop-filter: blur(8px);
		border-top: 1px solid rgba(24,31,46,.12);
		z-index: 8500;
		box-shadow: 0 -8px 22px rgba(24,31,46,.08);
	}
	.lw-sticky-cta__inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: .75rem;
		max-width: 560px;
		margin: 0 auto;
	}
	.lw-sticky-cta__copy {
		font-size: .9rem;
		font-weight: 600;
		color: #181F2E;
	}
	.lw-sticky-cta__btn {
		background: #181F2E;
		color: #FDF8E8;
		padding: .65rem 1.1rem;
		border-radius: 999px;
		font-size: .9rem;
		font-weight: 700;
		text-decoration: none;
		white-space: nowrap;
		flex-shrink: 0;
	}
	.lw-sticky-cta__btn:hover { color: #FDF8E8; background: #2B3A2E; }
	/* Reserve room at page-bottom so content isn't covered by the bar */
	body.lw-has-sticky-cta { padding-bottom: 72px; }
}

/* ============================================================
   Clinician-reviewed byline strip (condition + wellness pages)
   ------------------------------------------------------------
   Slim card right under the hero, gives credentialed reviewing
   signal to both human readers and Google's medical content team.
   ============================================================ */
.lw-byline {
	background: #FDF8E8;
	border-bottom: 1px solid rgba(24,31,46,.08);
	padding: 1.1rem 1.5rem;
}
.lw-byline__inner {
	max-width: 980px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	gap: 1rem;
}
.lw-byline__avatar {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid #fff;
	box-shadow: 0 1px 4px rgba(24,31,46,.12);
	background: #ECE6D6;
	flex-shrink: 0;
}
.lw-byline__meta { flex: 1; min-width: 0; }
.lw-byline__line {
	margin: 0;
	font-size: .95rem;
	line-height: 1.45;
	color: #181F2E;
}
.lw-byline__line--small {
	font-size: .82rem;
	color: #536B7A;
	margin-top: .15rem;
}
.lw-byline__label {
	font-size: .72rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 700;
	color: #536B7A;
	margin-right: .35rem;
}
.lw-byline__name { font-weight: 700; }
.lw-byline__cred { color: #3D5260; font-weight: 500; }
@media (max-width: 600px) {
	.lw-byline__inner { gap: .75rem; }
	.lw-byline__avatar { width: 40px; height: 40px; }
	.lw-byline__line { font-size: .9rem; }
	.lw-byline__line--small { font-size: .78rem; }
}

/* ============================================================
   Condition-page FAQ accordion (after meds-panel)
   ------------------------------------------------------------
   Auto-detected by faq-schema.php as FAQPage rich-result content.
   ============================================================ */
.lw-condition-faq {
	background: #F6F1E1;
	padding: 4rem 1.5rem;
}
.lw-condition-faq__inner {
	max-width: 760px;
	margin: 0 auto;
}
.lw-condition-faq__eyebrow {
	text-align: center;
	margin: 0 0 .65rem;
	font-size: .82rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 700;
	color: #536B7A;
}
.lw-condition-faq__heading {
	text-align: center;
	font-size: clamp(1.8rem, 3.5vw, 2.6rem);
	font-weight: 500;
	color: #181F2E;
	letter-spacing: -0.01em;
	margin: 0 0 2.5rem;
}
.lw-condition-faq__list { display: flex; flex-direction: column; gap: .55rem; }
.lw-condition-faq__item {
	background: #fff;
	border: 1px solid rgba(24,31,46,.12);
	border-radius: 12px;
	padding: 0;
	overflow: hidden;
	transition: box-shadow .2s ease;
}
.lw-condition-faq__item[open] { box-shadow: 0 4px 16px rgba(24,31,46,.08); }
.lw-condition-faq__item > summary {
	cursor: pointer;
	list-style: none;
	padding: 1.15rem 1.35rem;
	font-weight: 700;
	color: #181F2E;
	font-size: 1.02rem;
	line-height: 1.4;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
}
.lw-condition-faq__item > summary::-webkit-details-marker { display: none; }
.lw-condition-faq__item > summary::after {
	content: "+";
	font-size: 1.4rem;
	font-weight: 400;
	color: #2B3A2E;
	line-height: 1;
	flex-shrink: 0;
	transition: transform .2s ease;
}
.lw-condition-faq__item[open] > summary::after {
	content: "\2212"; /* minus */
	transform: rotate(0deg);
}
.lw-condition-faq__item > p {
	margin: 0;
	padding: 0 1.35rem 1.35rem;
	font-size: .98rem;
	line-height: 1.6;
	color: #3D5260;
}

/* ============================================================
   Accessibility: skip-to-content link
   ------------------------------------------------------------
   Hidden by default; appears on keyboard focus so keyboard + screen
   reader users can jump past the header straight to <main>.
   ============================================================ */
.lw-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: #181F2E;
	color: #FDF8E8;
	padding: .8rem 1.25rem;
	font-weight: 700;
	z-index: 99999;
	text-decoration: none;
	border-bottom-right-radius: 8px;
}
.lw-skip-link:focus,
.lw-skip-link:focus-visible {
	left: 0;
	outline: 3px solid #E9D8A6;
	outline-offset: 2px;
	color: #FDF8E8;
}

/* ============================================================
   Glossary popover (inline medication / treatment link intermediary)
   ------------------------------------------------------------
   Click on an .lw-glossary link opens a small floating card with the
   medication name, a one-line clinical note, and an explicit
   "Read the breakdown ->" button. Position is set by JS at click time.
   ============================================================ */
.lw-glossary-popover {
	position: absolute;
	width: 320px;
	max-width: calc(100vw - 24px);
	background: #fff;
	color: #181F2E;
	border-radius: 14px;
	box-shadow: 0 18px 40px rgba(24,31,46,.22), 0 2px 6px rgba(24,31,46,.08);
	padding: 1.1rem 1.25rem 1.15rem;
	z-index: 9700;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(6px) scale(.97);
	transform-origin: top center;
	transition: opacity .18s ease, transform .22s cubic-bezier(.2,.9,.3,1.1), visibility 0s linear .22s;
	border: 1px solid rgba(24,31,46,.08);
}
.lw-glossary-popover.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0) scale(1);
	transition: opacity .18s ease, transform .22s cubic-bezier(.2,.9,.3,1.1), visibility 0s;
}
.lw-glossary-popover--above {
	transform-origin: bottom center;
}
.lw-glossary-popover__close {
	position: absolute;
	top: .35rem;
	right: .5rem;
	background: transparent;
	border: 0;
	font-size: 1.35rem;
	line-height: 1;
	color: #536B7A;
	cursor: pointer;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
}
.lw-glossary-popover__close:hover { background: #F4EDD5; color: #181F2E; }
.lw-glossary-popover__eyebrow {
	margin: 0 0 .25rem;
	font-size: .7rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	font-weight: 700;
	color: #2B3A2E;
}
.lw-glossary-popover__name {
	margin: 0 0 .45rem;
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #181F2E;
}
.lw-glossary-popover__note {
	margin: 0 0 .9rem;
	font-size: .92rem;
	line-height: 1.5;
	color: #3D5260;
}
.lw-glossary-popover__cta {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .55rem .95rem;
	background: #181F2E;
	color: #FDF8E8;
	text-decoration: none;
	border-radius: 999px;
	font-size: .85rem;
	font-weight: 700;
	letter-spacing: .01em;
	transition: background .18s ease, transform .15s ease;
}
.lw-glossary-popover__cta:hover {
	background: #2B3A2E;
	color: #FDF8E8;
	transform: translateY(-1px);
}

/* ============================================================
   Hero text legibility on dark covers
   ------------------------------------------------------------
   Hero images vary in brightness (some have bright sky / sand /
   foreground areas that wash out white text even with dimRatio in
   place). A subtle text-shadow on every wp-block-cover heading +
   paragraph keeps the heading and sub-deck readable without darkening
   the image itself, which the owner wants kept as-is.
   ============================================================ */
/* Subtle text-shadow ONLY on the smaller hero sub-deck paragraph, NOT on the
   big H1 / H2. Large headings stay clean (the home "LiveWell, with us."
   would blur with any shadow). Small sub-deck text needs a touch of help
   to stay legible against bright image patches like the ADHD desk hero. */
.wp-block-cover.is-dark .wp-block-cover__inner-container p {
	text-shadow: 0 1px 3px rgba(0, 0, 0, .6);
}

/* ============================================================
   /consent/ (page 193) legibility rescue. The page is a raw
   Squarespace export rendering light text over a dark section
   background, leaving the legal copy unreadable. Scope a cream
   background + dark text to just that page and drop the dark
   section-background images so the text is legible. Proper
   rebuild is tracked separately; this is the readability fix.
   ============================================================ */
body.page-id-193 .section-background,
body.page-id-193 .section-background img { display: none !important; }
body.page-id-193 .page-section,
body.page-id-193 .page-section .section-border,
body.page-id-193 .content-wrapper {
	background-color: #F6F1E1 !important;
}
body.page-id-193 .page-section :is(p, li, h1, h2, h3, h4, h5, span, strong, em, blockquote) {
	color: #181F2E !important;
	text-shadow: none !important;
}
body.page-id-193 .page-section a { color: #2B3A2E !important; text-decoration: underline; }
/* Stronger: Squarespace wraps body copy in spans with inline light
   colors; force every descendant in the consent page sections to dark. */
body.page-id-193 .page-section * { color: #181F2E !important; text-shadow: none !important; }
body.page-id-193 .page-section a { color: #2B3A2E !important; }
/* Squarespace reveal-animation never fires (runtime JS stripped on
   import), leaving consent text stuck faded. Force it visible. */
body.page-id-193 .page-section,
body.page-id-193 .page-section * {
	opacity: 1 !important;
	visibility: visible !important;
	animation: none !important;
	transform: none !important;
	filter: none !important;
}

/* AGGRESSIVE nav fit (768-1079): keep the FULL header on tablets/laptops, just
   shrink it hard so it never clips. Hamburger is phone-only (<=767). */
@media (min-width: 768px) and (max-width: 1079px) {
  .site-header__inner { gap: .45rem; padding: .55rem .8rem; }
  .brand-mark__logo { height: 34px; width: 34px; }
  .site-nav .nav-menu { gap: .5rem; }
  .site-nav .nav-menu > li > a { font-size: .74rem; padding: .3rem 0; letter-spacing: 0; white-space: nowrap; }
  .header-socials { display: none !important; }
  .header-portal { display: none !important; }
  .header-cta { padding: .38rem .75rem; font-size: .76rem; }
}
/* Final safety so the inner row can never force overflow: let it shrink. */
.site-header__inner { min-width: 0; flex-wrap: nowrap; }
.site-nav { min-width: 0; }
.site-nav .nav-menu { flex-wrap: nowrap; }
