/*
Theme Name: Balm
Theme URI: https://schedopia.com/themes/balm
Author: ThinkMatic
Author URI: https://schedopia.com
Description: Balm is a calm, botanical block theme for day spas, massage studios and wellness spas. Eucalyptus green, soft stone, an elegant Fraunces serif and plenty of white space give your spa a site that feels as restful as your treatment rooms. It ships with every page a spa needs: home, treatments, pages for massage, facials, body treatments, spa rituals and couples treatments, a full spa menu with add-ons, therapists, first visit and spa etiquette, gift cards, gallery, reviews, about, journal, FAQ, contact, booking, spa policy and privacy policy. It works hand in hand with the free Schedopia booking plugin, so guests can choose a treatment and therapist, add extras like hot stones or 30 more minutes, and book a time right on your site. One click installs Schedopia and sets up your treatments, therapists, opening hours and pages, so you are ready to take bookings in minutes.
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: balm
Tags: block-patterns, block-styles, custom-colors, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, one-column, style-variations, template-editing, threaded-comments, translation-ready, wide-blocks, blog
*/

/*
 * Almost all styling lives in theme.json. This file only holds what
 * theme.json cannot express: block style variations and small refinements.
 */

/* ---------- Shared shapes ---------- */

:root {
	--balm-leaf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.5 3.5C10.5 3.5 4 9 4 16.5c0 1.3.2 2.5.6 3.5 1-4.6 4.4-8.7 9.7-11.4-4.6 3.2-7.4 7.2-8.2 11.9 8.8.3 14.4-5.7 14.4-17z'/%3E%3C/svg%3E");
}

/* ---------- Accessibility ---------- */

.screen-reader-text:focus {
	clip: auto !important;
	clip-path: none;
	height: auto;
	width: auto;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid color-mix(in srgb, var(--wp--preset--color--accent) 45%, transparent);
	outline-offset: 2px;
	border-radius: var(--wp--custom--radius--sm);
}

/* ---------- Tag (eyebrow) ---------- */

.is-style-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.7em;
	width: fit-content;
	margin-bottom: 0;
	color: var(--wp--preset--color--accent-3);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.4;
	text-transform: uppercase;
}

.is-style-eyebrow::before {
	content: "";
	flex: none;
	width: 1.75rem;
	height: 1px;
	background: currentColor;
	opacity: 0.6;
}

.is-style-eyebrow.has-text-align-center {
	margin-left: auto;
	margin-right: auto;
}

/* On the dark forest bands the tag follows the text colour. */
:is(.balm-cta, .has-deep-background-color) .is-style-eyebrow {
	color: inherit;
	opacity: 0.85;
}

/* Italic accents in headings: <em> turns into Fraunces italic in the accent. */
:is(h1, h2, h3, .wp-block-heading) em {
	color: var(--wp--preset--color--accent);
	font-style: italic;
	font-weight: 300;
}

:is(.balm-cta, .has-deep-background-color) :is(h1, h2, h3, .wp-block-heading) em {
	color: inherit;
}

/* ---------- Buttons ---------- */

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border: 1.5px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--contrast);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--accent-2);
	border-color: var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--contrast);
}

:is(.balm-cta, .has-deep-background-color) .wp-block-button.is-style-outline > .wp-block-button__link {
	border-color: color-mix(in srgb, currentColor 45%, transparent);
	color: inherit;
}

:is(.balm-cta, .has-deep-background-color) .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: color-mix(in srgb, currentColor 12%, transparent);
	color: inherit;
}

.wp-block-button.is-style-text-link > .wp-block-button__link {
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--wp--preset--color--accent);
	padding: 0;
	font-weight: 600;
}

.wp-block-button.is-style-text-link > .wp-block-button__link::after {
	content: "\2192";
	display: inline-block;
	margin-left: 0.35em;
	transition: transform 0.2s ease;
}

.wp-block-button.is-style-text-link > .wp-block-button__link:hover {
	background: transparent;
	color: var(--wp--preset--color--accent-3);
}

.wp-block-button.is-style-text-link > .wp-block-button__link:hover::after {
	transform: translateX(0.25em);
}

/* The inverse button on forest bands: page colours, so it works in every variation. */
.wp-block-button__link.has-base-background-color:hover {
	background: var(--wp--preset--color--accent-2) !important;
	color: var(--wp--preset--color--contrast) !important;
}

/* ---------- Images ---------- */

.wp-block-image.is-style-rounded img,
.wp-block-post-featured-image.is-style-rounded img {
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--preset--shadow--soft);
}

.wp-block-image.is-style-rounded.balm-xl img {
	border-radius: var(--wp--custom--radius--xl);
}

/* ---------- Groups ---------- */

.wp-block-group.is-style-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--preset--shadow--soft);
	padding: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--contrast);
}

.wp-block-group.is-style-tint-card {
	background: var(--wp--preset--color--accent-2);
	border-radius: var(--wp--custom--radius--lg);
	padding: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--contrast);
}

.has-base-2-background-color .wp-block-group.is-style-tint-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
}

/* ---------- Separators ---------- */

.wp-block-separator.is-style-short {
	border: 0;
	border-top: 3px solid var(--wp--preset--color--accent);
	border-radius: 3px;
	width: 3rem;
	margin-left: 0;
	opacity: 1;
}

/* ---------- Lists ---------- */

.wp-block-list.is-style-checks {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-checks li {
	position: relative;
	padding-left: 2em;
	margin-bottom: 0.7em;
}

.wp-block-list.is-style-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 1.3em;
	height: 1.3em;
	border-radius: 50%;
	background-color: var(--wp--preset--color--accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10'/%3E%3C/svg%3E") center / contain no-repeat;
}

.wp-block-list.is-style-checks li::after {
	content: "";
	position: absolute;
	left: 0.36em;
	top: 0.48em;
	width: 0.58em;
	height: 0.32em;
	border-left: 2px solid var(--wp--preset--color--on-accent);
	border-bottom: 2px solid var(--wp--preset--color--on-accent);
	transform: rotate(-45deg);
}

/* ---------- Announcement bar and header ---------- */

.balm-announce a {
	text-decoration: none;
	font-weight: 600;
}

.balm-announce a:hover {
	text-decoration: underline;
}

.balm-announce p {
	margin: 0;
}

.balm-header {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid var(--wp--preset--color--line);
	background: transparent !important;
}

/* The frosted backdrop lives on a pseudo-element: a backdrop-filter on the
   header itself would trap the mobile menu overlay inside the header. */
.balm-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: color-mix(in srgb, var(--wp--preset--color--base) 92%, transparent);
	-webkit-backdrop-filter: saturate(1.4) blur(12px);
	backdrop-filter: saturate(1.4) blur(12px);
}

@media (max-width: 599px) {
	.balm-announce p + p {
		display: none;
	}
}

.admin-bar .balm-header {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .balm-header {
		top: 0;
	}
}

.balm-header .wp-block-site-title a {
	text-decoration: none;
}

.balm-header .wp-block-site-title,
.balm-header .wp-block-button__link,
.balm-header__phone {
	white-space: nowrap;
}

/* A small leaf before the site name when there's no logo. */
.balm-header .wp-block-site-title a::before {
	content: "";
	display: inline-block;
	width: 0.95em;
	height: 0.95em;
	margin-right: 0.35em;
	vertical-align: -0.12em;
	background: var(--wp--preset--color--accent);
	-webkit-mask: var(--balm-leaf) center / contain no-repeat;
	mask: var(--balm-leaf) center / contain no-repeat;
}

.balm-header .wp-block-site-logo + .wp-block-site-title a::before {
	display: none;
}

.balm-header__phone a {
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
	text-decoration: none;
}

.balm-header__phone a:hover {
	color: var(--wp--preset--color--accent);
}

/* Dropdown: a soft card under the parent item. */
.balm-header .wp-block-navigation .wp-block-navigation__submenu-container {
	min-width: 15rem !important;
	padding: 0.5rem !important;
	border: 1px solid var(--wp--preset--color--line) !important;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--white) !important;
	box-shadow: var(--wp--preset--shadow--lift);
}

.balm-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.55rem 0.75rem !important;
	border-radius: var(--wp--custom--radius--sm);
}

.balm-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--contrast);
}

.balm-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
}

/* Mobile overlay: big, calm list with the submenu always open. */
.balm-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--40);
}

.balm-header .wp-block-navigation__responsive-container.is-menu-open :is(.wp-block-navigation__responsive-container-content, .wp-block-navigation__container, .wp-block-navigation__submenu-container) {
	align-items: flex-start !important;
	text-align: left;
}

.balm-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
}

.balm-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	min-width: 0 !important;
	padding: 0.25rem 0 0 1rem !important;
	border: 0 !important;
	box-shadow: none;
	background: transparent !important;
}

.balm-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 500;
}

/* Collapse the menu into the overlay below 1100px, not WordPress's default 600px. */
@media (max-width: 1099px) {
	.balm-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.balm-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	.balm-header__phone {
		display: none;
	}
}

@media (max-width: 599px) {
	.balm-header .balm-header__cta {
		display: none;
	}
}

/* ---------- Hero ---------- */

.balm-hero {
	overflow: hidden;
}

.balm-hero__media {
	position: relative;
}

/* A soft eucalyptus arch and a falling leaf behind the hero photo. */
.balm-hero__media::before {
	content: "";
	position: absolute;
	inset: 7% -7% -5% 12%;
	z-index: 0;
	border-radius: 999px 999px var(--wp--custom--radius--xl) var(--wp--custom--radius--xl);
	background: var(--wp--preset--color--accent-2);
}

.balm-hero__media::after {
	content: "";
	position: absolute;
	top: -1.75rem;
	left: -1.5rem;
	z-index: 0;
	width: 5.5rem;
	height: 5.5rem;
	background: color-mix(in srgb, var(--wp--preset--color--accent) 35%, transparent);
	-webkit-mask: var(--balm-leaf) center / contain no-repeat;
	mask: var(--balm-leaf) center / contain no-repeat;
	transform: rotate(-18deg);
}

.balm-hero__media > .wp-block-image {
	position: relative;
	z-index: 1;
}

.balm-hero__media .wp-block-image {
	margin: 0;
}

.balm-hero__media .wp-block-image.is-style-rounded img {
	border-radius: 999px 999px var(--wp--custom--radius--xl) var(--wp--custom--radius--xl);
}

.balm-float {
	position: absolute;
	z-index: 2;
	margin: 0 !important;
	padding: 0.85rem 1.1rem !important;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--lift);
	color: var(--wp--preset--color--contrast);
	line-height: 1.3;
}

.balm-float p {
	margin: 0;
}

.balm-float--rating {
	left: -1.5rem;
	bottom: 2.5rem;
}

.balm-float--hours {
	right: -1rem;
	top: 2rem;
}

@media (max-width: 781px) {
	.balm-float--rating {
		left: 0.75rem;
		bottom: 0.75rem;
	}

	.balm-float--hours {
		right: 0.75rem;
		top: 0.75rem;
	}
}

.balm-chips {
	gap: 0.5rem !important;
}

.balm-chip {
	margin: 0 !important;
	padding: 0.45em 0.9em;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
}

.balm-chip::before {
	content: "\2713";
	margin-right: 0.4em;
	color: var(--wp--preset--color--accent);
	font-weight: 700;
}

/* ---------- Trust bar ---------- */

.balm-trust p {
	margin: 0;
}

.balm-trust__item {
	align-items: center;
}

/* ---------- Icons (feature cards, trust bar) ---------- */

.balm-icon {
	display: grid;
	place-items: center;
	flex: none;
	width: 3rem;
	height: 3rem;
	margin: 0;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--accent-2);
	font-size: 0;
	line-height: 0;
}

.balm-icon::before {
	content: "";
	width: 1.5rem;
	height: 1.5rem;
	background: var(--wp--preset--color--accent);
	-webkit-mask: var(--balm-icon) center / contain no-repeat;
	mask: var(--balm-icon) center / contain no-repeat;
}

.balm-icon--sm {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: var(--wp--custom--radius--sm);
}

.balm-icon--sm::before {
	width: 1.25rem;
	height: 1.25rem;
}

/* Line icons drawn for Balm (GPL, see readme.txt). */
.balm-icon--shield { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.4 8.2-8 9-4.6-.8-8-4.5-8-9V6l8-3z'/%3E%3Cpath d='M8.5 12l2.5 2.5 4.5-5'/%3E%3C/svg%3E"); }
.balm-icon--card { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5'/%3E%3Cpath d='M3 10h18M7 15h4'/%3E%3C/svg%3E"); }
.balm-icon--calendar { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2.5'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4M8.5 15l2 2 4-4'/%3E%3C/svg%3E"); }
.balm-icon--clock { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.balm-icon--heart { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7.5-4.4-7.5-10A4.5 4.5 0 0112 7a4.5 4.5 0 017.5 3c0 5.6-7.5 10-7.5 10z'/%3E%3C/svg%3E"); }
.balm-icon--sparkle { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8L12 3zM18.5 15.5l.8 2.2 2.2.8-2.2.8-.8 2.2-.8-2.2-2.2-.8 2.2-.8.8-2.2z'/%3E%3C/svg%3E"); }
.balm-icon--phone { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h3.5l1.8 4.5-2.3 1.4a11 11 0 005.1 5.1l1.4-2.3L19 14.5V18a2 2 0 01-2 2A15 15 0 013 6a2 2 0 012-2z'/%3E%3C/svg%3E"); }
.balm-icon--leaf { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19c0-8 5-14 15-14 0 10-6 15-14 15M5 19l7-7'/%3E%3C/svg%3E"); }
.balm-icon--star { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9L12 3z'/%3E%3C/svg%3E"); }
.balm-icon--car { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-4.5L5.2 7h13.6l2.2 5.5V17h-2M3.5 12.5h17'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M9.5 17h5'/%3E%3C/svg%3E"); }
.balm-icon--hands { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 13V6.5a1.5 1.5 0 013 0V11M11 10.5V5a1.5 1.5 0 013 0v5.5M14 10.5V6.5a1.5 1.5 0 013 0V13c0 4.4-2.7 8-7 8h-.6c-2.2 0-3.7-.9-5-2.7L3.6 15a1.6 1.6 0 012.6-1.9L8 15'/%3E%3C/svg%3E"); }
.balm-icon--drop { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5s6 6.4 6 10.9a6 6 0 01-12 0c0-4.5 6-10.9 6-10.9z'/%3E%3Cpath d='M9.3 14.5A2.8 2.8 0 0012 17.2'/%3E%3C/svg%3E"); }
.balm-icon--lotus { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20c-2.7-1.9-4-4.8-4-8.1 0-2.9 1.5-5.6 4-7.9 2.5 2.3 4 5 4 7.9 0 3.3-1.3 6.2-4 8.1z'/%3E%3Cpath d='M12 20c-4.6 0-8.3-2.4-9-6.4 2.6-.2 4.7.5 6.3 2'/%3E%3Cpath d='M12 20c4.6 0 8.3-2.4 9-6.4-2.6-.2-4.7.5-6.3 2'/%3E%3C/svg%3E"); }
.balm-icon--couple { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3Ccircle cx='16' cy='8' r='3'/%3E%3Cpath d='M2.5 20c0-3.2 2.4-5.6 5.5-5.6s5.5 2.4 5.5 5.6M10.5 20c0-3.2 2.4-5.6 5.5-5.6s5.5 2.4 5.5 5.6'/%3E%3C/svg%3E"); }
.balm-icon--sun { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2.5v2M12 19.5v2M4.6 4.6l1.4 1.4M18 18l1.4 1.4M2.5 12h2M19.5 12h2M4.6 19.4L6 18M18 6l1.4-1.4'/%3E%3C/svg%3E"); }
.balm-icon--gift { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M5 12v8h14v-8M12 8v12M12 8C10.6 5 7 4.4 7 6.6 7 8 9.4 8 12 8zm0 0c1.4-3 5-3.6 5-1.4C17 8 14.6 8 12 8z'/%3E%3C/svg%3E"); }
.balm-icon--robe { --balm-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 3L12 8.5 15.5 3l4 2.5-1.5 6v9.5H6v-9.5l-1.5-6 4-2.5z'/%3E%3Cpath d='M12 8.5V21M9 14.5h2'/%3E%3C/svg%3E"); }

/* ---------- Feature cards ---------- */

.balm-feature {
	height: 100%;
}

.balm-feature .wp-block-heading {
	margin-top: 0.25rem;
}

/* ---------- Steps ---------- */

.balm-step__number {
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	margin: 0;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent) 40%, transparent);
	border-radius: 50%;
	color: var(--wp--preset--color--accent-3);
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.25rem;
	font-style: italic;
	font-weight: 400;
	line-height: 1;
}

/* ---------- Team ---------- */

.balm-person {
	height: 100%;
}

.balm-person .wp-block-image {
	margin-bottom: 0.5rem;
}

.balm-person .wp-block-heading {
	margin-top: 0.15rem;
}

.balm-person__role {
	margin: 0;
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

/* ---------- Specialty tiles ---------- */

.balm-tile {
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--lg);
	background: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--soft);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.balm-tile .wp-block-image {
	margin: 0;
	overflow: hidden;
}

.balm-tile .wp-block-image img {
	border-radius: 0;
	transition: transform 0.4s ease;
}

.balm-tile__body {
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
}

.balm-tile .wp-block-heading a {
	color: inherit;
	text-decoration: none;
}

.balm-tile .wp-block-heading a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.balm-tile {
	position: relative;
}

.balm-tile__more {
	margin: 0;
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.balm-tile__more::after {
	content: "\2192";
	display: inline-block;
	margin-left: 0.35em;
	transition: transform 0.2s ease;
}

.balm-tile:hover .balm-tile__more::after {
	transform: translateX(0.25em);
}

@media (prefers-reduced-motion: no-preference) {
	.balm-tile:hover {
		transform: translateY(-3px);
		box-shadow: var(--wp--preset--shadow--lift);
	}

	.balm-tile:hover .wp-block-image img {
		transform: scale(1.04);
	}
}

/* ---------- Anchor chips (Services) ---------- */

.balm-chipnav {
	gap: 0.5rem !important;
}

.balm-chipnav p {
	margin: 0;
}

.balm-chipnav a {
	display: inline-block;
	padding: 0.5em 1em;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}

.balm-chipnav a:hover {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

/* ---------- Gift card band ---------- */

.balm-band {
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--accent) 22%, transparent);
	border-radius: var(--wp--custom--radius--lg);
}

.balm-band .balm-icon {
	background: var(--wp--preset--color--white);
}

.wp-block-button__link.has-alert-background-color:hover {
	filter: brightness(0.92);
}

/* ---------- Call to action band ---------- */

.balm-cta {
	border-radius: var(--wp--custom--radius--xl);
	color: #FFFFFF;
}

.balm-cta a:not(.wp-block-button__link) {
	color: inherit;
}

.balm-cta .balm-muted {
	opacity: 0.85;
}

/* ---------- Opening hours table ---------- */

.balm-hours {
	margin: 0;
}

.balm-hours p {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin: 0;
	padding: 0.6em 0;
	border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent);
}

.balm-hours p span:first-child {
	font-weight: 600;
}

/* ---------- Reviews ---------- */

.balm-quote .wp-block-quote {
	border: 0;
	padding: 0;
	margin: 0;
}

.balm-quote .wp-block-quote cite {
	display: block;
	margin-top: 1rem;
}

.balm-stars {
	margin: 0;
	color: #C8A04A;
	letter-spacing: 0.12em;
	font-size: 1.05em;
}

/* ---------- FAQ (details) ---------- */

.wp-block-details {
	margin: 0;
	padding: var(--wp--preset--spacing--30) 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.wp-block-details + .wp-block-details {
	margin-top: 0 !important;
}

.wp-block-details summary {
	cursor: pointer;
	position: relative;
	padding-right: 2.75rem;
	list-style: none;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 400;
	letter-spacing: -0.01em;
	line-height: 1.35;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 1.9rem;
	height: 1.9rem;
	border-radius: 50%;
	background: var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--accent-3);
	font-family: var(--wp--preset--font-family--body);
	font-size: 1.15rem;
	font-weight: 600;
}

.wp-block-details[open] summary::after {
	content: "\2212";
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--on-accent);
}

.wp-block-details > :not(summary) {
	margin-top: 0.75em;
	color: var(--wp--preset--color--contrast-2);
}

/* ---------- Stats ---------- */

.balm-stat__number {
	margin: 0;
	color: var(--wp--preset--color--accent-3);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1;
}

/* ---------- Add-on price list ---------- */

.balm-addon {
	gap: 1.5rem !important;
	padding: 1rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.balm-addon p {
	margin: 0;
}

.balm-addon__price {
	flex: none;
	color: var(--wp--preset--color--accent-3);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
	text-align: right;
}

.balm-addon__price span {
	display: block;
	color: var(--wp--preset--color--contrast-2);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
}

/* ---------- Spa rituals ---------- */

.balm-rituals__menu > :first-child,
.balm-rituals__menu .balm-services {
	margin-top: 0;
}

/* ---------- Gallery ---------- */

.balm-gallery .wp-block-image {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--lg);
}

.balm-gallery .wp-block-image figcaption {
	position: absolute;
	right: 0.6rem;
	bottom: 0.6rem;
	left: 0.6rem;
	margin: 0;
	padding: 0.4rem 0.7rem;
	border-radius: var(--wp--custom--radius--pill);
	background: color-mix(in srgb, var(--wp--preset--color--white) 90%, transparent);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	text-align: center;
}

@media (prefers-reduced-motion: no-preference) {
	.balm-gallery .wp-block-image img {
		transition: transform 0.4s ease;
	}

	.balm-gallery .wp-block-image:hover img {
		transform: scale(1.04);
	}
}

/* ---------- Comparison cards ---------- */

.balm-compare .wp-block-heading {
	margin-top: 0;
}

.balm-compare__tag {
	margin: 0;
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* ---------- Footer ---------- */

.balm-footer {
	--balm-footer-muted: color-mix(in srgb, currentColor 72%, transparent);
}

.balm-footer .balm-brand {
	color: inherit;
}

.balm-footer .wp-block-navigation-item {
	margin-bottom: 0.15rem;
}

.balm-footer .wp-block-navigation a:hover {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.balm-footer .balm-hours p {
	padding: 0.4em 0;
}

.balm-footer__heading {
	margin-bottom: 0.75rem;
	opacity: 0.7;
}

/* ---------- Booking placeholder (when Schedopia is not active) ---------- */

.balm-booking-placeholder {
	border: 1.5px dashed var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--lg);
	background: var(--wp--preset--color--white);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	text-align: center;
}

.balm-booking-placeholder__title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 600;
	margin: 0 0 0.4em;
}

.balm-booking-placeholder p {
	margin: 0.4em 0;
}

/* ---------- Motion ---------- */

@media (prefers-reduced-motion: no-preference) {
	.wp-block-button__link,
	.wp-block-navigation-item__content {
		transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
	}

	.wp-block-button:not(.is-style-text-link) > .wp-block-button__link:hover {
		transform: translateY(-1px);
	}
}

/* ---------- Service menu preview (before Schedopia is set up) ---------- */

.balm-preview-note {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--contrast-2);
	margin-bottom: var(--wp--preset--spacing--30);
}

.balm-services {
	list-style: none;
	margin: var(--wp--preset--spacing--30) 0 0;
	padding: 0;
}

.balm-services--grid {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
}

@media (min-width: 960px) {
	.balm-services--grid {
		grid-template-columns: repeat(var(--balm-cols, 3), minmax(0, 1fr));
	}
}

.balm-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--preset--shadow--soft);
}

.balm-card img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.balm-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.45rem;
	padding: var(--wp--preset--spacing--30);
}

.balm-card__body p,
.balm-card__body h3 {
	margin: 0;
}

.balm-card__cat {
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.balm-card__title {
	font-size: var(--wp--preset--font-size--large);
}

.balm-card__desc {
	flex: 1;
	color: var(--wp--preset--color--contrast-2);
	font-size: var(--wp--preset--font-size--small);
}

.balm-card__meta {
	color: var(--wp--preset--color--contrast-2);
	font-size: var(--wp--preset--font-size--x-small);
}

.balm-card__foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	margin-top: 0.5rem;
	padding-top: 0.85rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--small);
}

.balm-card__price b {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.25rem;
	font-weight: 600;
}

.balm-card__price span {
	margin-left: 0.3em;
	color: var(--wp--preset--color--contrast-2);
	font-size: var(--wp--preset--font-size--x-small);
}

.balm-card__book {
	padding: 0.45em 1em;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--on-accent);
	font-weight: 600;
	text-decoration: none;
}

.balm-card__book:hover {
	background: var(--wp--preset--color--accent-3);
	color: var(--wp--preset--color--on-accent);
}

.balm-card--person img {
	aspect-ratio: 4 / 5;
}

.balm-menu__row {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 0.25rem 1.5rem;
	align-items: baseline;
	padding: 1rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.balm-menu__row p {
	margin: 0;
}

.balm-menu__title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
}

.balm-menu__desc {
	color: var(--wp--preset--color--contrast-2);
	font-size: var(--wp--preset--font-size--small);
}

.balm-menu__meta {
	color: var(--wp--preset--color--contrast-2);
	font-size: var(--wp--preset--font-size--small);
	white-space: nowrap;
}

.balm-menu__price {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	white-space: nowrap;
}

/* ---------- Muted text and dividers on any background ---------- */

.balm-muted {
	opacity: 0.78;
}

.balm-divider {
	border-top-style: solid;
	border-top-color: color-mix(in srgb, currentColor 18%, transparent);
}

/* Anchored sections clear the sticky header. */
[id] {
	scroll-margin-top: 6rem;
}

/* Sections butt up against the header and footer; no gap between template parts. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* ---------- Page heroes ---------- */

.balm-page-hero {
	background-image: radial-gradient(60rem 30rem at 85% -10%, color-mix(in srgb, var(--wp--preset--color--accent) 10%, transparent), transparent 70%);
}

/* Portraits and tiles two across on phones; tighter type to fit. */
@media (max-width: 599px) {
	.balm-team,
	.balm-tiles {
		gap: var(--wp--preset--spacing--30) !important;
	}

	.balm-team .wp-block-heading,
	.balm-tiles .wp-block-heading {
		font-size: 1.0625rem !important;
	}

	.balm-team .balm-person__role {
		font-size: var(--wp--preset--font-size--x-small);
	}

	/* Stacked tiles: landscape photos, so the list stays short. */
	.balm-tiles .wp-block-image img {
		aspect-ratio: 4 / 3 !important;
	}
}