/*
Theme Name: Souly Arts Awake
Theme URI: https://soulyarts.drink8waterperday.com/
Description: A calm, editorial WordPress block theme for Souly Arts Studio, inspired by the supplied Awake reference.
Author: Souly Arts Studio
Version: 2.3.59
Template: twentytwentyfive
Text Domain: souly-arts-awake
*/

:root {
	--sa-paper: #f7f5f0;
	--sa-ink: #3f423d;
	--sa-muted: #787d77;
	--sa-sage: #dce2dc;
	--sa-sage-dark: #859286;
	--sa-sky: #d8dfe2;
	--sa-line: rgba(63, 66, 61, 0.13);
}

html {
	scroll-behavior: smooth;
}

body {
	background: var(--sa-paper);
	color: var(--sa-ink);
	font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
}

h1,
h2,
h3,
h4,
.sa-display {
	font-family: "Noto Serif TC", "Songti TC", "PMingLiU", Georgia, serif;
	font-weight: 400;
	letter-spacing: 0.015em;
}

a {
	text-underline-offset: 0.2em;
}

.sa-header {
	position: relative;
	z-index: 20;
	background: rgba(247, 245, 240, 0.96);
	border-bottom: 1px solid var(--sa-line);
}

.sa-header__inner {
	max-width: 1280px;
	min-height: 86px;
	margin-inline: auto;
	padding: 0.65rem clamp(1rem, 4vw, 3.25rem);
}

.sa-brand {
	line-height: 1.2;
}

/* Frame the original transparent PNG without resampling or changing its colour. */
.sa-brand .sa-header__logo {
	position: relative;
	width: 192px;
	max-width: 100%;
	aspect-ratio: 668 / 257;
	margin: 0;
	margin-inline: 0 !important;
	overflow: hidden;
}

.sa-header__logo a {
	display: block;
	width: 100%;
	height: 100%;
}

.sa-header__logo img {
	position: absolute;
	left: -12.12575%;
	top: -115.5642%;
	width: 127.2455%;
	max-width: none;
	height: auto;
	filter: brightness(0);
}

.sa-header__logo a:focus-visible {
	outline: 2px solid var(--sa-ink);
	outline-offset: -2px;
}

@media (min-width: 782px) and (max-width: 1000px) {
	.sa-brand .sa-header__logo { width: 168px; }
}

@media (max-width: 781px) {
	.sa-header { padding-inline: 0; }
	.sa-brand .sa-header__logo { width: 144px; }
}

.sa-brand .wp-block-site-title {
	margin: 0;
	font-family: "Noto Serif TC", "Songti TC", Georgia, serif;
	font-size: clamp(1rem, 1.2vw, 1.22rem);
	font-weight: 500;
	letter-spacing: 0.08em;
}

.sa-brand .wp-block-site-title a {
	color: var(--sa-ink);
	text-decoration: none;
}

.sa-brand-note {
	margin: 0.2rem 0 0;
	color: var(--sa-muted);
	font-size: 0.68rem;
	letter-spacing: 0.19em;
	text-transform: uppercase;
}

.sa-navigation {
	font-size: 0.82rem;
	letter-spacing: 0.045em;
}

.sa-navigation .wp-block-navigation-item__content {
	color: var(--sa-ink);
	text-decoration: none;
	transition: color 160ms ease;
}

.sa-navigation .wp-block-navigation-item__content:hover,
.sa-navigation .wp-block-navigation-item__content:focus-visible {
	color: var(--sa-sage-dark);
	text-decoration: underline;
}

.sa-main {
	margin-block: 0 !important;
}

.sa-section {
	padding: clamp(4rem, 8vw, 7.5rem) clamp(1.1rem, 5vw, 4.75rem);
}

.sa-section--compact {
	padding-block: clamp(3rem, 5vw, 4.75rem);
}

.sa-section--sage {
	background: var(--sa-sage);
}

.sa-section--sky {
	background: var(--sa-sky);
}

.sa-section--deep-sage {
	background: var(--sa-sage-dark);
	color: #fff;
}

.sa-section--deep-sage h1,
.sa-section--deep-sage h2,
.sa-section--deep-sage h3,
.sa-section--deep-sage p {
	color: #fff;
}

.sa-section__inner {
	max-width: 1160px;
	margin-inline: auto;
}

.sa-eyebrow {
	margin: 0 0 1rem;
	color: var(--sa-sage-dark);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.19em;
	line-height: 1.6;
	text-transform: uppercase;
}

.sa-display {
	max-width: 15ch;
	margin: 0;
	font-size: clamp(2.55rem, 5.8vw, 5.1rem);
	line-height: 1.16;
}

.sa-page-title {
	max-width: 20ch;
	margin: 0;
	font-size: clamp(2.45rem, 5vw, 4.5rem);
	line-height: 1.2;
}

/* Keep the Chinese corporate-workshop headline on its two intended lines. */
body.page-id-19 .sa-hero .sa-page-title {
	max-width: none;
	font-size: clamp(1.5rem, 4vw, 3.25rem);
}

body.page-id-19 .sa-hero .sa-page-title > .sa-corporate-title-line {
	display: block;
	white-space: nowrap;
}

@media (max-width: 781px) {
	body.page-id-19 .sa-hero .sa-page-title {
		font-size: clamp(1.5rem, 8.5vw, 3.25rem);
	}
}

.sa-section-title {
	max-width: 24ch;
	margin: 0 0 1.25rem;
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 1.24;
}

body:is(.page-id-15, .page-id-48) .sa-section:has(> .sa-three-cards) > .sa-section-title {
	width: fit-content;
	max-width: none;
	margin-inline: auto;
	text-align: center;
}

body:is(.page-id-15, .page-id-48) .sa-section:has(> .sa-gallery-grid) > .sa-section-title {
	width: fit-content;
	max-width: none;
	margin-inline: auto;
	text-align: center;
}

.sa-subtitle {
	margin: 0 0 0.8rem;
	font-size: clamp(1.28rem, 2.2vw, 1.75rem);
	line-height: 1.4;
}

.sa-lead {
	max-width: 58ch;
	color: #555b55;
	font-size: clamp(1.08rem, 1.5vw, 1.27rem);
	line-height: 1.9;
}

.sa-copy {
	max-width: 72ch;
	color: #555b55;
	line-height: 1.9;
}

.sa-hero {
	padding-top: clamp(3.5rem, 7vw, 6.7rem);
	padding-bottom: clamp(4rem, 8vw, 7rem);
	background: linear-gradient(112deg, #e6e8e4 0%, var(--sa-paper) 55%, #e8e5df 100%);
}

/* Match the About hero to the sage team section on both language pages. */
body:is(.page-id-16, .page-id-52) .sa-hero {
	background: var(--sa-sage);
}

.sa-hero__grid {
	align-items: center;
	gap: clamp(2rem, 6vw, 6.4rem);
}

.sa-hero__copy {
	padding-block: 1.5rem;
}

.sa-hero__copy .sa-lead {
	margin-top: 1.35rem;
}

.sa-hero__media {
	position: relative;
	margin: 0;
}

.sa-hero__media img {
	display: block;
	width: 100%;
	height: clamp(390px, 48vw, 610px);
	object-fit: cover;
	object-position: center;
}

.sa-hero__caption {
	position: absolute;
	right: -1rem;
	bottom: 1.35rem;
	max-width: 15rem;
	margin: 0;
	padding: 1.15rem 1.35rem;
	background: rgba(247, 245, 240, 0.94);
	color: var(--sa-ink);
	font-family: "Noto Serif TC", "Songti TC", Georgia, serif;
	font-size: 0.98rem;
	line-height: 1.65;
}

.sa-buttons {
	gap: 0.8rem;
	margin-top: 1.6rem;
}

.sa-section > :is(.sa-three-cards, .sa-gallery-grid, .sa-reference-gallery) + .sa-buttons,
.sa-cta > .sa-buttons {
	justify-content: center;
}

.sa-buttons .wp-block-button__link {
	border: 1px solid var(--sa-sage-dark);
	border-radius: 0;
	padding: 0.8rem 1.35rem;
	font-size: 0.88rem;
	letter-spacing: 0.045em;
	text-decoration: none;
	transition: background 160ms ease, color 160ms ease;
}

.sa-button--primary .wp-block-button__link {
	background: var(--sa-sage-dark);
	color: #fff;
}

.sa-button--primary .wp-block-button__link:hover,
.sa-button--primary .wp-block-button__link:focus-visible {
	background: #6f7d70;
}

.sa-button--outline .wp-block-button__link {
	background: transparent;
	color: var(--sa-ink);
}

.sa-button--outline .wp-block-button__link:hover,
.sa-button--outline .wp-block-button__link:focus-visible {
	background: var(--sa-sage-dark);
	color: #fff;
}

.sa-three-cards {
	gap: 1rem;
	margin-top: 2.2rem;
}

.sa-card {
	--sa-card-padding: clamp(1.35rem, 2.6vw, 2.2rem);
	height: 100%;
	box-sizing: border-box;
	padding: var(--sa-card-padding);
	background: rgba(255, 255, 255, 0.68);
	border: 1px solid rgba(63, 66, 61, 0.1);
}

.sa-card--paper {
	background: var(--sa-paper);
}

.sa-card--white {
	background: #fff;
}

.sa-card > figure.wp-block-image.sa-card__image {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0 0 1.15rem;
	padding: 0.45rem;
	border: 1px solid var(--sa-line);
	background: #fffdf9;
}

.sa-card__image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: center 45%;
}

.sa-card__number {
	margin: 0 0 1.35rem;
	color: var(--sa-sage-dark);
	font-family: Georgia, serif;
	font-size: 0.83rem;
	letter-spacing: 0.14em;
}

.sa-card h3 {
	margin: 0 0 0.7rem;
	font-size: clamp(1.32rem, 2vw, 1.7rem);
}

.sa-card p {
	margin: 0;
	color: #5c625c;
	font-size: 0.96rem;
	line-height: 1.85;
}

.sa-card a {
	display: inline-block;
	margin-top: 1rem;
	color: var(--sa-ink);
	font-size: 0.85rem;
	text-decoration-thickness: 1px;
}

.sa-three-cards:has(> .wp-block-column:nth-child(4):last-child) .sa-card {
	display: flex;
	flex-direction: column;
}

.sa-three-cards:has(> .wp-block-column:nth-child(4):last-child) .sa-card > p:not(.sa-card__number):not(:last-of-type) {
	width: calc(100% + var(--sa-card-padding) / 2);
	max-width: none;
	margin-inline: 0 !important;
	text-wrap: wrap;
}

.sa-three-cards:has(> .wp-block-column:nth-child(4):last-child) .sa-card > p:last-of-type {
	margin-top: auto;
	margin-left: 0 !important;
	margin-right: 0 !important;
	align-self: stretch;
	padding-top: 1rem;
}

.sa-three-cards:has(> .wp-block-column:nth-child(4):last-child) .sa-card > p:last-of-type a {
	margin-top: 0;
}

@media (min-width: 782px) {
	body.sa-language-en.page-id-48 .sa-three-cards:has(> .wp-block-column:nth-child(3):last-child) .sa-card {
		display: flex;
		flex-direction: column;
	}

	body.sa-language-en.page-id-48 .sa-three-cards:has(> .wp-block-column:nth-child(3):last-child) .sa-card > * {
		margin-inline: 0 !important;
	}

	body.sa-language-en.page-id-48 .sa-three-cards:has(> .wp-block-column:nth-child(3):last-child) .sa-card > p:last-of-type {
		margin-top: auto;
		align-self: stretch;
		padding-top: 1rem;
	}

	body.sa-language-en.page-id-48 .sa-three-cards:has(> .wp-block-column:nth-child(3):last-child) .sa-card > p:last-of-type a {
		margin-top: 0;
	}

	body.sa-language-en.page-id-48 .sa-three-cards:has(> .wp-block-column:nth-child(3):last-child) .sa-card > h3,
	body.sa-language-en .sa-three-cards:has(> .wp-block-column:nth-child(4):last-child) .sa-card > h3 {
		line-height: 1.25;
		min-height: 2.5em;
	}
}

@media (min-width: 782px) and (max-width: 899px) {
	body.sa-language-en.page-id-48 .sa-three-cards:has(> .wp-block-column:nth-child(3):last-child) .sa-card > h3,
	body.sa-language-en .sa-three-cards:has(> .wp-block-column:nth-child(4):last-child) .sa-card > h3 {
		min-height: 3.75em;
	}
}

.sa-split {
	align-items: center;
	gap: clamp(2rem, 6vw, 6rem);
}

.sa-split--reverse {
	flex-direction: row-reverse;
}

.sa-split__image img {
	display: block;
	width: 100%;
	height: clamp(320px, 38vw, 510px);
	object-fit: cover;
}

.sa-profile-image img {
	display: block;
	width: min(100%, 420px);
	margin-inline: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
}

.sa-gallery-grid {
	gap: 1rem;
	margin-top: 2rem;
}

.sa-gallery-item {
	margin: 0;
}

.sa-gallery-item img {
	display: block;
	width: 100%;
	height: clamp(220px, 25vw, 320px);
	object-fit: cover;
}

.sa-gallery-item figcaption {
	padding: 0.8rem 0 0;
	color: var(--sa-muted);
	font-size: 0.83rem;
	line-height: 1.6;
	text-align: left;
}

.sa-detail-section {
	border-top: 1px solid var(--sa-line);
	padding-block: clamp(2.7rem, 5vw, 4.7rem);
}

.sa-detail-section:first-of-type {
	border-top: 0;
}

.sa-detail-section h2 {
	margin: 0 0 1rem;
	font-size: clamp(1.65rem, 3vw, 2.45rem);
}

.sa-detail-section h3 {
	margin: 2rem 0 0.7rem;
	font-size: clamp(1.25rem, 2.3vw, 1.65rem);
}

.sa-meta-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem 1.8rem;
	margin-block: 1rem 1.5rem;
	color: var(--sa-muted);
	font-size: 0.9rem;
}

.sa-list {
	padding-left: 1.25rem;
	color: #555b55;
	line-height: 1.9;
}

.sa-list li + li {
	margin-top: 0.45rem;
}

.sa-note {
	margin-top: 2rem;
	padding: 1.2rem 1.4rem;
	background: #eeece6;
	color: #555b55;
	font-size: 0.92rem;
	line-height: 1.8;
}

/* Give each corporate-workshop type its own surface and align its consent notice. */
body:is(.page-id-19, .page-id-54) .entry-content,
body:is(.page-id-19, .page-id-54) .entry-content > .sa-detail-section {
	background-color: #e3e7e2;
}

body:is(.page-id-19, .page-id-54) #handmade-workshops,
body.page-id-19 #handmade-workshops + .sa-detail-section {
	background-color: #eee7dd;
}

body:is(.page-id-19, .page-id-54) #mindfulness-workshops {
	background-color: #e1e8ec;
}

body:is(.page-id-19, .page-id-54) .entry-content .sa-note {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 760px);
	margin-inline: auto;
	border-inline-start: 3px solid var(--sa-sage-dark);
	background: #fffdf9;
	text-align: start;
	text-indent: 0;
}

body.page-id-19 .entry-content > .sa-note {
	width: min(var(--wp--style--global--content-size, 760px), calc(100% - 2 * clamp(1.1rem, 5vw, 4.75rem)));
	margin-block: 0 clamp(2.7rem, 5vw, 4.7rem);
}

body.page-id-19 .sa-detail-section:has(+ .sa-note) {
	padding-block-end: 2rem;
}

@media (max-width: 560px) {
	body.page-id-19 .entry-content > .sa-note {
		width: calc(100% - 2.3rem);
	}
}

.sa-cta {
	text-align: center;
}

.sa-cta .sa-section-title,
.sa-cta .sa-lead {
	margin-inline: auto;
}

/* Close the homepage with a deliberate contact band after the therapist profile. */
.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta {
	margin-block-start: 0;
	padding-block: clamp(3.5rem, 6vw, 5.5rem);
	background: #657266;
	color: var(--sa-paper);
}

.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta :is(h1, h2, h3, p) {
	color: var(--sa-paper);
}

.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-eyebrow {
	color: rgba(247, 245, 240, 0.8);
}

.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-button--primary .wp-block-button__link {
	border-color: var(--sa-paper);
	background: var(--sa-paper);
	color: var(--sa-ink);
}

.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-button--primary .wp-block-button__link:hover,
.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-button--primary .wp-block-button__link:focus-visible {
	border-color: #e5e2db;
	background: #e5e2db;
}

.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-button--outline .wp-block-button__link {
	border-color: rgba(247, 245, 240, 0.78);
	color: var(--sa-paper);
}

.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-button--outline .wp-block-button__link:hover,
.home .entry-content > .sa-section:has(.sa-profile__copy) + .sa-cta .sa-button--outline .wp-block-button__link:focus-visible {
	border-color: var(--sa-paper);
	background: var(--sa-paper);
	color: var(--sa-ink);
}

.home .wp-site-blocks > footer.wp-block-template-part {
	margin-block-start: 0;
}

.sa-contact-grid {
	gap: clamp(1.5rem, 4vw, 3.8rem);
	margin-top: 2.4rem;
}

/* The contact details and enquiry card are separate sections; reduce their shared boundary padding. */
body:is(.page-id-24, .page-id-51) .wp-block-post-content > .wp-block-group.sa-section:has(> .sa-contact-grid) {
	padding-block-end: 1.5rem;
}

body:is(.page-id-24, .page-id-51) .sa-enquiry {
	padding-block-start: 1.5rem;
}

.sa-contact-item {
	padding: 1.5rem 0;
	border-top: 1px solid var(--sa-line);
}

.sa-contact-item h3 {
	margin: 0 0 0.5rem;
	font-size: 1.18rem;
}

.sa-contact-item p {
	margin: 0;
	color: #555b55;
	line-height: 1.8;
}

.sa-section > .sa-contact-map.alignwide {
	width: 100%;
	max-width: 1160px;
	min-width: 0;
	margin: 2rem auto 0;
}

.sa-contact-map iframe {
	display: block;
	width: 100%;
	height: clamp(280px, 38vw, 420px);
	border: 0;
}

.sa-partner-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.7rem;
	margin-top: 1.5rem;
}

.sa-partner-list > p {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	width: 100%;
	min-width: 0;
	max-width: none;
	margin: 0 !important;
	padding: 0.85rem 1rem;
	border: 1px solid var(--sa-line);
	background: var(--sa-sage);
	color: var(--sa-ink);
	font-size: 0.9rem;
	line-height: 1.65;
	overflow-wrap: anywhere;
}

.sa-footer {
	padding: clamp(3.5rem, 6vw, 5.5rem) clamp(1.1rem, 5vw, 4.75rem) 1.5rem;
	background: #303c35;
	color: #d7ded4;
}

.sa-footer h3 {
	margin: 0 0 1.25rem;
	color: #f7f5f0;
	font-family: "Noto Sans TC", "PingFang TC", sans-serif;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	line-height: 1.5;
}

.sa-footer p,
.sa-footer a {
	color: #d7ded4;
}

.sa-footer > .sa-footer__inner {
	width: 100%;
	max-width: 1280px;
	margin-inline: auto;
}

.sa-footer .sa-footer__columns.wp-block-columns {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.65fr) minmax(0, 1fr) minmax(210px, 1.05fr);
	width: 100%;
	max-width: none;
	gap: clamp(2rem, 4vw, 4.5rem);
	margin: 0;
	padding-bottom: 3.75rem;
}

.sa-footer__columns > .wp-block-column {
	min-width: 0;
}

/* Frame the supplied logo's transparent margins without changing its pixels. */
.sa-footer .sa-footer__logo {
	position: relative;
	width: 265px;
	max-width: 100%;
	aspect-ratio: 668 / 257;
	margin: 0 0 1.65rem;
	overflow: hidden;
}

.sa-footer__logo a {
	display: block;
	width: 100%;
	height: 100%;
}

.sa-footer__logo img {
	position: absolute;
	left: -12.12575%;
	top: -115.5642%;
	width: 127.2455%;
	max-width: none;
	height: auto;
	filter: brightness(0) invert(1);
}

.sa-footer__logo a:focus-visible {
	outline: 2px solid #f7f5f0;
	outline-offset: -3px;
}

.sa-footer .sa-footer__intro {
	margin: 0;
	font-size: 0.9rem;
	line-height: 2;
	letter-spacing: 0.025em;
}

.sa-footer .sa-footer__menu {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.88rem;
	line-height: 1.8;
}

.sa-footer__menu li {
	margin: 0 0 0.3rem;
	padding: 0;
}

.sa-footer__menu a {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	text-decoration: none;
}

.sa-footer .sa-footer__contact-item {
	margin: 0 0 1.25rem;
	font-size: 0.86rem;
	line-height: 1.8;
}

.sa-footer__contact-item a {
	text-decoration: none;
}

.sa-footer__label {
	display: block;
	margin-bottom: 0.4rem;
	color: #aab8ab;
	font-size: 0.68rem;
	letter-spacing: 0.09em;
	line-height: 1.5;
}

.sa-footer__email {
	white-space: nowrap;
}

.sa-footer .sa-footer__socials {
	gap: 0.65rem;
	margin: 1.5rem 0 0;
	padding: 0;
}

.sa-footer .sa-footer__socials .wp-social-link {
	color: #e6ebe2;
	background: transparent;
}

.sa-footer .sa-footer__socials a {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 10px;
	border: 1px solid rgba(230, 235, 226, 0.25);
	border-radius: 50%;
	color: inherit;
	transition: background-color 180ms ease;
}

.sa-footer .sa-footer__socials a:hover {
	background: rgba(230, 235, 226, 0.1);
}

.sa-footer .sa-footer__socials svg {
	width: 20px;
	height: 20px;
}

.sa-footer a:hover,
.sa-footer a:focus-visible {
	color: #fff;
	text-decoration: underline;
}

.sa-footer .sa-footer__small {
	max-width: none;
	margin: 0;
	border-top: 1px solid rgba(230, 235, 226, 0.17);
	padding-top: 1.35rem;
	color: #b7c3b7;
	font-size: 0.72rem;
	line-height: 1.7;
}

@media (min-width: 600px) and (max-width: 1099px) {
	.sa-footer .sa-footer__columns.wp-block-columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2.75rem 3rem;
	}
}

@media (max-width: 599px) {
	.sa-footer .sa-footer__columns.wp-block-columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2.5rem 1.25rem;
		padding-bottom: 2.5rem;
	}

	.sa-footer__identity,
	.sa-footer__contact {
		grid-column: 1 / -1;
	}

	.sa-footer .sa-footer__logo {
		width: 245px;
	}

	.sa-footer__menu a {
		min-height: 42px;
	}
}

@media (max-width: 781px) {
	.sa-header__inner.is-layout-flex {
		min-height: 72px;
		flex-wrap: nowrap;
		align-items: center;
		gap: 0.75rem;
	}

	.sa-brand {
		min-width: 0;
		flex: 1 1 auto;
	}

	.sa-navigation {
		flex: 0 0 auto;
		margin-left: auto;
	}

	.sa-hero__grid,
	.sa-split {
		gap: 2rem;
	}

	.sa-hero__media img {
		height: min(115vw, 520px);
	}

	.sa-hero__caption {
		right: 0.7rem;
		bottom: 0.7rem;
	}

	.sa-three-cards .wp-block-column,
	.sa-contact-grid .wp-block-column,
	.sa-gallery-grid .wp-block-column {
		flex-basis: calc(50% - 0.5rem) !important;
	}

	.sa-partner-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Keep WordPress modal behaviour; give its mobile content an editorial layout. */
	body .sa-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
		--sa-menu-admin-offset: 0px;
		box-sizing: border-box;
		padding: 0;
		color: var(--sa-ink);
		background: var(--sa-paper) !important;
		animation: none;
	}

	body.admin-bar .sa-navigation .wp-block-navigation__responsive-container.is-menu-open {
		--sa-menu-admin-offset: 46px;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-close {
		width: 100%;
		max-width: none;
	}

	body .sa-navigation .is-menu-open:not(.disable-default-overlay) .wp-block-navigation__responsive-container-content {
		box-sizing: border-box;
		width: 100%;
		min-height: calc(100vh - var(--sa-menu-admin-offset));
		min-height: calc(100svh - var(--sa-menu-admin-offset));
		margin: 0;
		padding: max(5rem, calc(env(safe-area-inset-top) + 4rem)) max(1.5rem, env(safe-area-inset-right)) max(3rem, calc(env(safe-area-inset-bottom) + 2rem)) max(1.5rem, env(safe-area-inset-left));
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0;
		text-align: center;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content::before {
		content: "SOULY ARTS STUDIO";
		display: block;
		flex: 0 0 auto;
		margin-bottom: clamp(1.25rem, 4svh, 2rem);
		color: var(--sa-muted);
		font-family: sans-serif;
		font-size: 0.65rem;
		font-weight: 400;
		letter-spacing: 0.24em;
		line-height: 1.5;
		animation: sa-menu-item-in 800ms ease both;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content::after {
		content: "心繫藝術 · 以創作陪伴成長";
		display: block;
		flex: 0 0 auto;
		margin-top: clamp(1.5rem, 4svh, 2rem);
		padding-top: 1.25rem;
		border-top: 1px solid var(--sa-line);
		color: var(--sa-muted);
		font-size: 0.65rem;
		font-weight: 400;
		letter-spacing: 0.12em;
		line-height: 1.7;
		animation: sa-menu-item-in 800ms 400ms ease both;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
		box-sizing: border-box;
		flex: 0 0 auto;
		width: 100%;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: clamp(0.3rem, 1.6svh, 0.8rem);
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item {
		box-sizing: border-box;
		width: auto;
		min-width: 0;
		display: flex;
		align-items: center;
		animation: sa-menu-item-in 720ms cubic-bezier(0.22, 1, 0.36, 1) both;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
		box-sizing: border-box;
		min-height: 44px;
		padding: 0.25rem 0.65rem;
		color: var(--sa-ink);
		font-family: "Noto Serif TC", "Songti TC", "PMingLiU", Georgia, serif;
		font-size: clamp(1.5rem, 7vw, 1.8rem);
		font-weight: 400;
		letter-spacing: 0.14em;
		line-height: 1.55;
		text-align: center;
		text-decoration: none;
		text-underline-offset: 0.35em;
		text-decoration-thickness: 1px;
		transition: color 200ms ease;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content:hover,
	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content:focus-visible {
		color: var(--sa-ink);
		text-decoration: underline;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content:focus-visible {
		outline: 2px solid transparent;
		outline-offset: 4px;
		text-decoration-thickness: 2px;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation-item:nth-child(1) { animation-delay: 80ms; }
	body .sa-navigation .is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: 160ms; }
	body .sa-navigation .is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: 240ms; }
	body .sa-navigation .is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: 320ms; }
	body .sa-navigation .is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: 400ms; }

	@keyframes sa-menu-item-in {
		from { opacity: 0; transform: translateY(12px); }
		to { opacity: 1; transform: translateY(0); }
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-close {
		top: max(0.75rem, env(safe-area-inset-top));
		right: max(1rem, env(safe-area-inset-right));
		width: 44px;
		height: 44px;
		padding: 11px;
		border: 0;
		border-radius: 0;
		color: var(--sa-ink);
		background: transparent;
	}

	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-close:hover {
		background: var(--sa-sage);
	}
}

@media (forced-colors: active) {
	body .sa-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content:focus-visible {
		outline-color: Highlight;
	}
}

@media (max-width: 560px) {
	.sa-section {
		padding-inline: 1.15rem;
	}

	.sa-display {
		font-size: clamp(2.5rem, 12vw, 3.7rem);
	}

	.sa-three-cards .wp-block-column,
	.sa-contact-grid .wp-block-column,
	.sa-gallery-grid .wp-block-column {
		flex-basis: 100% !important;
	}

	.sa-gallery-item img {
		height: 78vw;
		max-height: 440px;
	}

	.sa-partner-list {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	* {
		transition-duration: 0.01ms !important;
	}

	body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
	body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before,
	body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::after,
	body .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Reference-document photos stay fully visible, including supplied face masks. */
.sa-reference-gallery.wp-block-group {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 1.5rem;
 margin-block: 2rem;
}
.sa-reference-gallery > .sa-reference-photo { width: 100%; max-width: none; margin: 0; }
.sa-reference-photo img { display: block; width: 100%; height: clamp(220px, 29vw, 360px); object-fit: contain; background: rgba(220, 226, 220, .22); }
.sa-reference-photo figcaption { margin-top: .7rem; color: var(--sa-muted); font-size: .82rem; line-height: 1.6; text-align: center; }
/* Contained photos and their labels share a centre, even with mixed aspect ratios. */
.sa-section:has(> .sa-reference-gallery) > :is(.sa-eyebrow, .sa-section-title) { text-align: center; }
.sa-reference-gallery--single.wp-block-group { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.sa-reference-gallery--single .sa-reference-photo img { height: auto; max-height: 660px; object-fit: contain; }
@media (max-width: 599px) {
 .sa-reference-gallery.wp-block-group { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
 .sa-reference-photo img { height: auto; max-height: 520px; object-fit: contain; }
}

/* Keep every page's final section joined cleanly to the shared footer. */
.wp-site-blocks > main.sa-main + .wp-block-template-part {
	margin-block-start: 0 !important;
}

/* The About article uses a paper surface, so its photos should not sit on a grey mat. */
body:is(.page-id-16, .page-id-52) .sa-reference-photo img {
	background: transparent;
}

/* Match the About art-therapy photos to the activity-gallery frames. */
body:is(.page-id-16, .page-id-52) .sa-detail-section:has(> .sa-reference-gallery) > .sa-reference-gallery > .sa-reference-photo {
	box-sizing: border-box;
	padding: 16px;
	background: #fffdf9;
	border: 1px solid rgba(63, 66, 61, 0.1);
	box-shadow: 8px 8px 0 rgba(96, 111, 88, 0.09), 0 16px 28px rgba(58, 68, 54, 0.055);
}

/* Align About art-therapy text with the full width of its framed photo gallery. */
body:is(.page-id-16, .page-id-52) .sa-detail-section:has(> .sa-reference-gallery) > :is(.wp-block-heading, .sa-copy) {
	box-sizing: border-box;
	width: min(var(--wp--style--global--wide-size, 1160px), 100%);
	max-width: min(var(--wp--style--global--wide-size, 1160px), 100%);
	margin-inline: auto !important;
}

/* Add the requested breathing room before the studio's 2022 founding paragraph. */
.sa-detail-section > .sa-team-foundation-copy {
	margin-block-start: clamp(2rem, 3vw, 2.5rem);
}

/* Use the supplied pale sage colour for the team introduction on both About pages. */
body:is(.page-id-16, .page-id-52) .sa-detail-section:has(> .sa-team-foundation-copy) {
	background-color: #e2e7e2;
}

/* Match the English homepage therapist section to the supplied sage swatch. */
body.page-id-48 .entry-content > .sa-section:has(.sa-profile-image) {
	background-color: #e3e7e2;
}

/* Crop the therapist portrait into a circle without its embedded white edge. */
body:is(.home, .page-id-16, .page-id-48, .page-id-52) .sa-profile-image > figure.wp-block-image {
	box-sizing: border-box;
	width: min(100%, 420px);
	max-width: 100%;
	aspect-ratio: 1 / 1;
	margin-inline: auto;
	padding: 0;
	overflow: hidden;
	border-radius: 50%;
	background-color: transparent;
}

body:is(.home, .page-id-16, .page-id-48, .page-id-52) .sa-profile-image > figure.wp-block-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
	transform: scale(1.04) scaleX(1.014);
	transform-origin: center;
}

/* A ten-em title keeps the Chinese individual-therapy headline balanced in two lines. */
body.page-id-21 .sa-page-title {
	max-width: 10em;
}

@media (min-width: 782px) {
	body.page-id-21 .sa-page-title {
		font-size: clamp(2.3rem, 3.8vw, 3.4rem);
	}
}

@media (max-width: 599px) {
	body.page-id-21 .sa-page-title {
		font-size: clamp(1.75rem, 9vw, 2.25rem);
	}
}

/* Widen and align the bilingual individual-therapy copy without changing its wording. */
body:is(.page-id-21, .page-id-56) .sa-section:is(.sa-section--sage, .sa-detail-section):not(.sa-cta).is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull):not(.sa-therapy-artwork)) {
	max-width: 860px;
}

body:is(.page-id-21, .page-id-56) .sa-section:is(.sa-section--sage, .sa-detail-section):not(.sa-cta) > :where(p, ul) {
	width: 100%;
	max-width: 100%;
	text-indent: 0;
}

body:is(.page-id-21, .page-id-56) .sa-section:not(.sa-cta) .sa-note {
	box-sizing: border-box;
	width: 100%;
	max-width: 860px;
	text-indent: 0;
}

/* Match the art-therapy artwork frame, caption, and width to the EFT image below. */
body:is(.page-id-21, .page-id-56) .sa-therapy-artwork {
	box-sizing: border-box;
	width: 100%;
	max-width: 860px;
	margin: clamp(1.5rem, 3vw, 2.5rem) auto;
	padding: 16px;
	background: #fffdf9;
	border: 1px solid rgba(63, 66, 61, 0.1);
	box-shadow: 8px 8px 0 rgba(96, 111, 88, 0.09), 0 16px 28px rgba(58, 68, 54, 0.055);
}

body:is(.page-id-21, .page-id-56) .sa-therapy-artwork img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 660px;
	object-fit: contain;
	background: rgba(220, 226, 220, 0.22);
}

body:is(.page-id-21, .page-id-56) .sa-therapy-artwork figcaption {
	margin-top: 0.7rem;
	color: var(--sa-muted);
	font-size: 0.82rem;
	line-height: 1.6;
	text-align: center;
}

/* Give the EFT reference the same full-width paper frame as the artwork above. */
body:is(.page-id-21, .page-id-56) .sa-detail-section:has(> .sa-reference-gallery) > .sa-reference-gallery > .sa-reference-photo {
	box-sizing: border-box;
	padding: 16px;
	background: #fffdf9;
	border: 1px solid rgba(63, 66, 61, 0.1);
	box-shadow: 8px 8px 0 rgba(96, 111, 88, 0.09), 0 16px 28px rgba(58, 68, 54, 0.055);
}