/* ==========================================================================
   Conversion layer (Oct 2026 UX review). Loaded after public/frontend.css.
   Tokens: navy #2C405D (client), brand blue #3d7ca4, ink #3c3c3c,
   Lato (UI), Playfair Display (headings). Breakpoint 992px like the theme.
   ========================================================================== */

:root {
	--behr-navy: #2C405D;
	--behr-navy-deep: #1f2f46;
	--behr-blue: #3d7ca4;
	--behr-ink: #3c3c3c;
	--behr-muted: #6b7280;
	--behr-line: #e3e8ef;
	--behr-font-ui: "Lato", sans-serif;
	--behr-font-display: "Playfair Display", serif;
}

html {
	scroll-behavior: smooth;
}

/* The sticky header is 116px tall on desktop (css/header.css). */
#consultation,
#gallery-single {
	scroll-margin-top: 130px;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.btn-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 24px;
	border: 2px solid transparent;
	border-radius: 4px;
	font-family: var(--behr-font-ui);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .12em;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s, color .2s, border-color .2s;
}

.btn-cta--light {
	background: #fff;
	color: var(--behr-navy);
	border-color: #fff;
}

.btn-cta--light:hover,
.btn-cta--light:focus-visible {
	background: #e9eef5;
	color: var(--behr-navy-deep);
	text-decoration: none;
}

/* Same button, smaller (header). */
.btn-cta--compact {
	min-height: 40px;
	padding: 8px 16px;
	font-size: 12px;
	white-space: nowrap;
}

.btn-cta--outline {
	background: transparent;
	color: #fff;
	border-color: rgba(255, 255, 255, .7);
}

.btn-cta--outline:hover,
.btn-cta--outline:focus-visible {
	background: rgba(255, 255, 255, .12);
	color: #fff;
	border-color: #fff;
	text-decoration: none;
}

.btn-cta--navy {
	background: var(--behr-navy);
	color: #fff;
	border-color: var(--behr-navy);
}

.btn-cta--navy:hover,
.btn-cta--navy:focus-visible {
	background: var(--behr-navy-deep);
	color: #fff;
	text-decoration: none;
}

.btn-cta:focus-visible {
	outline: 3px solid #ffbf47;
	outline-offset: 2px;
}

/* Home "Book online now": solid, high-contrast version of the theme button */
.ui-btn.ui-w.ui-btn--book {
	background: var(--behr-navy);
	color: #fff;
	padding: 14px 28px;
	border-radius: 4px;
	font-size: 16px;
	line-height: 1.2;
}

.ui-btn.ui-w.ui-btn--book:hover,
.ui-btn.ui-w.ui-btn--book:focus-visible {
	background: var(--behr-navy-deep);
	color: #fff;
	box-shadow: none;
}

/* --------------------------------------------------------------------------
   Treatment hero
   -------------------------------------------------------------------------- */
.treatment-hero {
	position: relative;
	display: grid;
	/* Starts below the desktop header: its height (--hdr-h, css/header.css) is taken off. */
	min-height: max(calc(70vh - var(--hdr-h)), 604px);
	max-height: calc(800px - var(--hdr-h));
	background: var(--behr-navy-deep);
	overflow: hidden;
}

.treatment-hero__media,
.treatment-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.treatment-hero__img {
	object-fit: cover;
	object-position: center top;
	display: block;
}

.treatment-hero__card {
	position: relative;
	z-index: 2;
	align-self: end;
	justify-self: start;
	width: min(560px, calc(100% - 2 * 6vw));
	margin: 0 6vw 40px;
	padding: 32px 36px;
	background: var(--behr-navy);
	color: #fff;
	border-radius: 6px;
	box-shadow: 0 24px 48px rgba(0, 0, 0, .25);
	font-family: var(--behr-font-ui);
}

.treatment-hero__eyebrow {
	margin: 0 0 12px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .78);
}

.treatment-hero__title {
	margin: 0 0 14px;
	font-family: var(--behr-font-display);
	font-weight: 400;
	font-size: clamp(30px, 3.2vw, 42px);
	line-height: 1.15;
	color: #fff;
}

.treatment-hero__lead {
	margin: 0 0 22px;
	font-size: 16px;
	line-height: 1.55;
	color: rgba(255, 255, 255, .92);
}

.treatment-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 18px;
}

.treatment-hero__proof,
.treatment-hero__phone {
	margin: 0;
	font-size: 14px;
	line-height: 1.4;
	color: rgba(255, 255, 255, .9);
}

.treatment-hero__proof {
	margin-bottom: 6px;
}

.treatment-hero__proof a,
.treatment-hero__phone a {
	color: #fff;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, .5);
	text-underline-offset: 3px;
}

.treatment-hero__proof a:hover,
.treatment-hero__phone a:hover {
	text-decoration-color: #fff;
}

.treatment-hero__rating {
	font-weight: 700;
	text-decoration: none !important;
}

.treatment-hero__star {
	color: #ffc63b;
	margin-right: 2px;
}

.treatment-hero__gallery {
	display: inline-block;
	margin-top: 16px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, .6);
}

.treatment-hero__gallery:hover {
	color: #fff;
	border-bottom-color: #fff;
	text-decoration: none;
}

@media screen and (max-width: 992px) {
	.treatment-hero {
		display: block;
		min-height: 0;
		max-height: none;
		background: #fff;
		overflow: visible;
	}

	.treatment-hero__media {
		position: relative;
		height: 46vh;
		min-height: 240px;
		max-height: 420px;
	}

	.treatment-hero__card {
		width: auto;
		margin: -56px 16px 0;
		padding: 24px 22px;
		border-radius: 6px;
	}

	.treatment-hero__title {
		font-size: 28px;
	}

	.treatment-hero__lead {
		font-size: 15px;
		margin-bottom: 14px;
	}

	/* Mobile: both buttons stacked, full width. */
	.treatment-hero__actions {
		flex-direction: column;
		gap: 10px;
	}

	.treatment-hero__actions .btn-cta {
		width: 100%;
	}
}

/* --------------------------------------------------------------------------
   Consultation form (section #consultation)
   -------------------------------------------------------------------------- */
/* Card sized to the form (720px + padding), centered in the content column. */
.consultation {
	max-width: 800px;
	margin: 48px auto 24px;
	padding: 40px;
	background: #f4f6f9;
	border: 1px solid var(--behr-line);
	border-radius: 8px;
	font-family: var(--behr-font-ui);
}

.consultation__inner {
	max-width: 720px;
	margin: 0 auto;
}

.consultation__eyebrow {
	margin: 0 0 8px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--behr-blue);
}

.consultation__title {
	margin: 0 0 8px;
	font-family: var(--behr-font-display);
	font-weight: 400;
	font-size: 32px;
	line-height: 1.2;
	color: var(--behr-ink);
	text-align: left;
}

.consultation__intro {
	margin: 0 0 20px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--behr-muted);
}

.consultation__form iframe {
	display: block;
	min-height: 420px;
}

.consultation__phone {
	margin: 16px 0 0;
	font-size: 14px;
	color: var(--behr-muted);
	text-align: center;
}

.consultation__phone a {
	color: var(--behr-navy);
	font-weight: 700;
}

@media screen and (max-width: 992px) {
	/* Full width of the content column, same side spacing as the blocks around it. */
	.consultation {
		max-width: none;
		margin: 32px 0 16px;
		padding: 28px 16px;
	}

	.consultation__title {
		font-size: 26px;
	}
}

/* --------------------------------------------------------------------------
   Gravity Forms consultation form (.behr-consult, lib/conversion/gravity-forms.php)
   Same form in the treatment section and in the footer section (.requestform).
   GF prints its stylesheets after this file: rules start with .behr-consult
   .gform_wrapper.gravity-theme to win. Borders keep 3:1 against the background.
   -------------------------------------------------------------------------- */
.behr-consult {
	--consult-border: #7a8ca5;
	--consult-chip-on: #d3dce8;
	--consult-error: #b42318;
	font-family: var(--behr-font-ui);
}

.behr-consult .gform_wrapper.gravity-theme .gform_fields {
	grid-row-gap: 10px;
}

/* "What are you interested in?" chips */
.behr-consult .gform_wrapper.gravity-theme .gfield--type-radio {
	margin-bottom: 6px;
}

.behr-consult .gform_wrapper.gravity-theme .gfield--type-radio legend.gfield_label {
	margin: 0 0 14px;
	padding: 0;
	font-family: var(--behr-font-ui);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--behr-navy);
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio .gchoice {
	position: relative;
	display: block;
	margin: 0;
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio input[type="radio"] {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	pointer-events: none; /* the label (for=) takes the click */
}

/* public/frontend.css moves every <label> off screen: bring back the visible ones. */
.behr-consult .gform_wrapper.gravity-theme .gfield_radio label,
.behr-consult .gform_wrapper.gravity-theme .ginput_container_consent label {
	position: relative;
	top: auto;
	left: auto;
	width: auto;
	height: auto;
	overflow: visible;
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio label {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	max-width: none;
	margin: 0;
	padding: 6px 10px;
	background: #fff;
	border: 1px solid var(--consult-border);
	border-radius: 6px;
	font-size: 15px;
	line-height: 1.2;
	text-align: center;
	color: var(--behr-ink);
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease;
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio .gchoice:hover label {
	border-color: var(--behr-navy);
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio input:checked + label {
	background: var(--consult-chip-on);
	border-color: var(--behr-navy);
	box-shadow: inset 0 0 0 1px var(--behr-navy);
	color: var(--behr-navy);
	font-weight: 700;
}

.behr-consult .gform_wrapper.gravity-theme .gfield_radio input:focus-visible + label {
	outline: 2px solid var(--behr-blue);
	outline-offset: 2px;
}

/* Text, phone and email inputs (labels are visually hidden, placeholders show the hint) */
.behr-consult .gform_wrapper.gravity-theme input[type="text"],
.behr-consult .gform_wrapper.gravity-theme input[type="tel"],
.behr-consult .gform_wrapper.gravity-theme input[type="email"] {
	width: 100%;
	height: 48px;
	margin: 0;
	padding: 0 14px;
	background: #fff;
	border: 1px solid var(--consult-border);
	border-radius: 3px;
	box-shadow: none;
	font-family: var(--behr-font-ui);
	font-size: 16px; /* 16px: no zoom on focus in iOS Safari */
	color: var(--behr-ink);
}

.behr-consult .gform_wrapper.gravity-theme input::placeholder {
	color: var(--behr-muted);
	opacity: 1;
}

.behr-consult .gform_wrapper.gravity-theme input[type="text"]:focus,
.behr-consult .gform_wrapper.gravity-theme input[type="tel"]:focus,
.behr-consult .gform_wrapper.gravity-theme input[type="email"]:focus {
	border-color: var(--behr-navy);
	outline: 2px solid var(--behr-blue);
	outline-offset: 1px;
}

/* SMS consent (two boxes, A2P wording over several lines) */
.behr-consult .gform_wrapper.gravity-theme .ginput_container_consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.behr-consult .gform_wrapper.gravity-theme .ginput_container_consent input[type="checkbox"] {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 1px 0 0;
	accent-color: var(--behr-navy);
}

.behr-consult .gform_wrapper.gravity-theme .ginput_container_consent label {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
	color: #4b5563; /* --behr-muted is 4.47:1 on the form background, too light for 13px. */
}

.behr-consult .gform_wrapper.gravity-theme .ginput_container_consent label a {
	color: var(--behr-navy);
	text-decoration: underline;
}

/* Submit */
.behr-consult .gform_wrapper.gravity-theme .gform_footer {
	margin: 18px 0 0;
	padding: 0;
}

.behr-consult .gform_wrapper.gravity-theme .gform_footer .gform_button {
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 12px 20px;
	background: var(--behr-navy);
	border: 0;
	border-radius: 4px;
	font-family: var(--behr-font-ui);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 1.2;
	text-transform: uppercase;
	color: #fff;
	cursor: pointer;
	transition: background-color .15s ease;
}

.behr-consult .gform_wrapper.gravity-theme .gform_footer .gform_button:hover {
	background: var(--behr-navy-deep);
}

.behr-consult .gform_wrapper.gravity-theme .gform_footer .gform_button:focus-visible {
	outline: 2px solid var(--behr-blue);
	outline-offset: 2px;
}

/* Validation */
.behr-consult .gform_wrapper.gravity-theme .gform_validation_errors {
	margin: 0 0 16px;
	padding: 12px 14px;
	border: 1px solid var(--consult-error);
	border-radius: 4px;
	box-shadow: none;
	background: #fff;
}

.behr-consult .gform_wrapper.gravity-theme .gform_validation_errors > h2 {
	padding: 0;
	font-family: var(--behr-font-ui);
	font-size: 15px;
	color: var(--consult-error);
}

.behr-consult .gform_wrapper.gravity-theme .gform_validation_errors > h2 .gform-icon {
	display: none;
}

.behr-consult .gform_wrapper.gravity-theme .gfield_error input[type="text"],
.behr-consult .gform_wrapper.gravity-theme .gfield_error input[type="tel"],
.behr-consult .gform_wrapper.gravity-theme .gfield_error input[type="email"] {
	border-color: var(--consult-error);
}

.behr-consult .gform_wrapper.gravity-theme .gfield_validation_message {
	margin-top: 4px;
	padding: 0;
	background: none;
	border: 0;
	font-size: 14px;
	color: var(--consult-error);
}

/* Confirmation */
.behr-consult .gform_confirmation_message {
	padding: 20px;
	background: #fff;
	border: 1px solid var(--behr-line);
	border-left: 4px solid var(--behr-navy);
	border-radius: 4px;
	font-family: var(--behr-font-ui);
	font-size: 16px;
	line-height: 1.5;
	color: var(--behr-ink);
}

.behr-consult .gform_confirmation_message p {
	margin: 0;
}

/* Footer section: the theme only gives it a 780px min-height with no vertical padding, and the
   form is taller, so the title touched the section above and the card touched the footer. */
section.requestform .content {
	padding-top: 60px;
	padding-bottom: 60px;
}

/* Footer section: the form sits on a light card like the treatment section */
.requestform .formmain .behr-consult {
	padding: 28px 24px;
	background: #f4f6f9;
	border: 1px solid var(--behr-line);
	border-radius: 8px;
	text-align: left;
}

@media screen and (max-width: 479px) {
	.behr-consult .gform_wrapper.gravity-theme .gfield_radio {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.requestform .formmain .behr-consult {
		padding: 22px 16px;
	}
}

@media screen and (max-width: 767px) {
	section.requestform .content {
		padding-top: 40px;
		padding-bottom: 40px;
	}
}

/* --------------------------------------------------------------------------
   Sticky CTA: desktop = header pill, mobile = bottom bar
   -------------------------------------------------------------------------- */
/* Floating consultation button (treatment pages), bottom right.
   Visibility is driven by js/conversion.js through .is-visible. */
.book-sticky {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 1200;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 14px 28px;
	border-radius: 4px;
	background: var(--behr-navy);
	color: #fff;
	font-family: var(--behr-font-ui);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .12em;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: 0 8px 24px rgba(23, 16, 32, .22);
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px);
	transition: opacity .25s, visibility .25s, transform .25s, background-color .2s;
}

.book-sticky.is-visible {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.book-sticky:hover,
.book-sticky:focus-visible {
	background: var(--behr-navy-deep);
	color: #fff;
	text-decoration: none;
}

.book-sticky:focus-visible {
	outline: 3px solid #ffbf47;
	outline-offset: 2px;
}

/* The theme's back-to-top button (#scroll, bottom right) moves above it. */
body.book-sticky-visible #scroll {
	bottom: 92px;
}

@media screen and (max-width: 992px) {
	.book-sticky {
		right: 16px;
		bottom: calc(16px + env(safe-area-inset-bottom));
		padding: 14px 22px;
		font-size: 12px;
	}

	body.book-sticky-visible #scroll {
		bottom: calc(84px + env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion: reduce) {
	.book-sticky {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   Treatments mega menu
   -------------------------------------------------------------------------- */
nav.navdiv .navbaritems > ul.items > li.menu-item > .dropmenu .menu-items.menu-items-block.tmenu {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr)) 260px;
	gap: 32px;
	align-items: start;
	padding: 36px 40px;
	font-family: var(--behr-font-ui);
	text-align: left;
}

.tmenu__col {
	min-width: 0;
}

.tmenu__head {
	position: relative;
	padding-bottom: 12px;
	margin-bottom: 14px;
	border-bottom: 1px solid var(--behr-line);
}

.tmenu__title {
	margin: 0;
	font-family: var(--behr-font-display);
	font-weight: 400;
	font-size: 22px;
	line-height: 1.2;
	color: var(--behr-ink);
	text-align: left;
}

.tmenu__title-link {
	color: inherit;
	text-decoration: none;
}

.tmenu__title-link:hover {
	color: var(--behr-blue);
	text-decoration: none;
}

.tmenu__tagline {
	margin: 4px 0 0;
	font-size: 13px;
	font-style: italic;
	line-height: 1.4;
	color: var(--behr-blue);
}

.tmenu__toggle {
	display: none;
}

.tmenu__groups,
.tmenu__groups li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tmenu__head {
	min-height: 84px;
}

.tmenu__groups > .tmenu__group {
	margin: 0 0 12px;
	line-height: 1.4;
}

.tmenu__label {
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
	color: var(--behr-ink);
}

.tmenu__pill {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 9px;
	border-radius: 999px;
	background: #e8f1f7;
	color: var(--behr-navy);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	vertical-align: middle;
}

.tmenu__pill:hover {
	background: var(--behr-navy);
	color: #fff;
	text-decoration: none;
}

.tmenu__brands {
	display: block;
	font-size: 13px;
	color: var(--behr-muted);
}

.tmenu__brand {
	color: var(--behr-muted);
	text-decoration: none;
}

.tmenu__brand:hover {
	color: var(--behr-blue);
	text-decoration: underline;
}

.tmenu__groups > .tmenu__group--all {
	margin-top: 18px;
}

.tmenu__all,
.tmenu__fv-all {
	font-size: 13px;
	font-weight: 700;
	color: var(--behr-blue);
	text-decoration: none;
}

.tmenu__all:hover,
.tmenu__fv-all:hover {
	text-decoration: underline;
}

.tmenu__firstvisit {
	padding: 28px 26px;
	background: var(--behr-navy);
	color: #fff;
	border-radius: 6px;
}

.tmenu__title--fv {
	color: #fff;
	margin-bottom: 10px;
}

.tmenu__fv-text {
	margin: 0 0 18px;
	font-size: 14px;
	line-height: 1.5;
	color: rgba(255, 255, 255, .9);
}

.tmenu__fv-btn {
	width: 100%;
	margin-bottom: 22px;
}

.tmenu__fv-sub {
	margin: 0 0 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.tmenu__fv-list {
	margin: 0 0 18px;
	padding-left: 18px;
	font-size: 13px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .9);
}

.tmenu__fv-all {
	color: #fff;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, .5);
}

/* The theme's a:hover (dark blue) would win over a single class on the navy panel. */
.tmenu__fv-all:hover,
.tmenu__fv-all:focus-visible {
	color: #fff;
	text-decoration-color: #fff;
}

/* Beat the theme's generic p / li colors and margins inside the navy panel. */
nav.navdiv .navbaritems .tmenu .tmenu__firstvisit p,
nav.navdiv .navbaritems .tmenu .tmenu__firstvisit li {
	color: rgba(255, 255, 255, .92);
}

nav.navdiv .navbaritems .tmenu .tmenu__firstvisit .tmenu__fv-sub {
	color: #fff;
}

nav.navdiv .navbaritems .tmenu .tmenu__fv-list li {
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 1.6;
}

@media screen and (max-width: 1300px) {
	nav.navdiv .navbaritems > ul.items > li.menu-item > .dropmenu .menu-items.menu-items-block.tmenu {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 24px;
		padding: 28px 24px;
	}

	.tmenu__firstvisit {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 4px 32px;
		align-items: center;
		padding: 22px 26px;
	}

	.tmenu__firstvisit .tmenu__title--fv,
	.tmenu__fv-text {
		grid-column: 1;
		margin: 0;
	}

	.tmenu__fv-btn {
		grid-column: 2;
		grid-row: 1 / span 2;
		width: auto;
		margin: 0;
	}

	.tmenu__fv-sub,
	.tmenu__fv-list {
		display: none;
	}

	.tmenu__fv-all {
		grid-column: 1 / -1;
		margin-top: 8px;
	}
}

@media screen and (max-width: 992px) {
	nav.navdiv .navbaritems > ul.items > li.menu-item > .dropmenu .menu-items.menu-items-block.tmenu {
		display: block;
		padding: 8px 16px 16px;
	}

	.tmenu__col {
		border-bottom: 1px solid var(--behr-line);
	}

	.tmenu__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 0;
		padding: 12px 0;
		margin: 0;
		border: 0;
	}

	.tmenu__title {
		font-size: 19px;
	}

	.tmenu__tagline {
		display: none;
	}

	.tmenu__toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		flex: 0 0 40px;
		border: 1px solid var(--behr-line);
		border-radius: 4px;
		background: #fff;
		color: var(--behr-ink);
		font-size: 22px;
		line-height: 1;
		cursor: pointer;
	}

	.tmenu__col.is-open .tmenu__toggle span {
		display: inline-block;
		transform: rotate(45deg);
	}

	.tmenu__groups {
		display: none;
		padding: 0 0 12px;
	}

	.tmenu__col.is-open .tmenu__groups {
		display: block;
	}

	.tmenu__groups > .tmenu__group {
		margin-bottom: 12px;
	}

	.tmenu__firstvisit {
		display: block;
		margin-top: 16px;
		padding: 20px 18px;
		border: 0;
	}

	.tmenu__firstvisit .tmenu__toggle {
		display: none;
	}

	.tmenu__firstvisit .tmenu__title--fv {
		margin: 0 0 8px;
	}

	.tmenu__firstvisit .tmenu__fv-text {
		margin: 0 0 16px;
	}

	.tmenu__fv-btn {
		width: 100%;
		margin: 0 0 16px;
	}

	.tmenu__fv-sub,
	.tmenu__fv-list {
		display: block;
	}
}

/* --------------------------------------------------------------------------
   treatment_goal archive
   -------------------------------------------------------------------------- */
.goal-tagline {
	margin: -8px 0 16px;
	font-family: var(--behr-font-ui);
	font-size: 16px;
	font-style: italic;
	color: var(--behr-blue);
}
