/**
 * わむずリニューアル ページ固有スタイル: スタッフ紹介。
 * トップページの温白・濃茶・金のデザイン言語へ統一する。
 */

#wamuzu-renewal-practitioner {
	--wn-staff-paper: oklch(.982 .011 82);
	--wn-staff-paper-strong: oklch(.994 .006 82);
	--wn-staff-paper-soft: oklch(.952 .025 76);
	--wn-staff-ink: oklch(.29 .014 60);
	--wn-staff-cocoa: oklch(.42 .035 58);
	--wn-staff-muted: oklch(.5 .014 63);
	--wn-staff-gold: oklch(.69 .08 76);
	--wn-staff-gold-text: oklch(.52 .08 76);
	--wn-staff-gold-light: oklch(.82 .06 79);
	--wn-staff-line: oklch(.47 .035 60 / .18);
	--wn-staff-shadow: 0 1.25rem 3.75rem oklch(.3 .025 58 / .09);
	--wn-maxw: 68.75rem;
	background: var(--wn-staff-paper);
	color: var(--wn-staff-ink);
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	overflow: clip;
}

#wamuzu-renewal-practitioner,
#wamuzu-renewal-practitioner *,
#wamuzu-renewal-practitioner *::before,
#wamuzu-renewal-practitioner *::after {
	box-sizing: border-box;
}

.wn-page .wn-practitioner-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: clamp(6.75rem, 9vw, 9.25rem) clamp(1.25rem, 5vw, 4rem) clamp(3.75rem, 5.5vw, 5.25rem);
	background:
		radial-gradient(circle at 10% 12%, oklch(.72 .06 67 / .13), transparent 32%),
		linear-gradient(135deg, var(--wn-staff-paper-strong) 0%, var(--wn-staff-paper) 52%, var(--wn-staff-paper-soft) 100%);
	text-align: center;
}

.wn-page .wn-practitioner-hero::after {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: min(30vw, 11.25rem);
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--wn-staff-gold), transparent);
	content: "";
	transform: translateX(-50%);
}

.wn-page .wn-practitioner-hero .wn-container {
	display: grid;
	justify-items: center;
}

.wn-page .wn-practitioner-eyebrow {
	margin: 0 0 .75rem;
	font-family: "Cormorant Garamond", Georgia, serif !important;
	font-size: clamp(.9rem, 1.5vw, 1.05rem);
	font-weight: 500;
	letter-spacing: .2em;
	line-height: 1.4;
	text-transform: uppercase;
}

.wn-page .wn-practitioner-eyebrow {
	color: var(--wn-staff-gold-text);
}

#wamuzu-renewal-practitioner .wn-hero__catch {
	margin: 0;
	color: var(--wn-staff-ink);
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	font-size: clamp(2.35rem, 4.4vw, 3.75rem);
	font-weight: 800;
	letter-spacing: .025em;
	line-height: 1.35;
	text-wrap: balance;
}

.wn-page .wn-practitioner-hero .wn-hero__sub {
	max-width: 36rem;
	margin: clamp(1.25rem, 2.5vw, 1.75rem) 0 0;
	color: var(--wn-staff-muted);
	font-size: clamp(.94rem, 1.45vw, 1.08rem);
	line-height: 1.9;
	text-wrap: balance;
}

.wn-page .wn-staff-section {
	padding: clamp(4.5rem, 7vw, 7rem) clamp(1.25rem, 5vw, 4rem) clamp(6rem, 9vw, 9rem);
	background: linear-gradient(180deg, var(--wn-staff-paper) 0%, var(--wn-staff-paper-strong) 48%, var(--wn-staff-paper-soft) 100%);
}

.wn-page .wn-staff-section > .wn-container > .wn-h2 {
	position: relative;
	margin: 0;
	padding-bottom: 1.25rem;
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	font-size: clamp(1.75rem, 3.2vw, 2.5rem);
	font-weight: 700;
	letter-spacing: .025em;
	line-height: 1.45;
	text-align: center;
	text-wrap: balance;
}

.wn-page .wn-staff-section > .wn-container > .wn-h2 {
	margin-bottom: clamp(2.75rem, 5vw, 4.25rem);
	color: var(--wn-staff-ink);
}

.wn-page .wn-staff-section > .wn-container > .wn-h2::after {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 4.5rem;
	height: 2px;
	background: var(--wn-staff-gold);
	content: "";
	transform: translateX(-50%);
}

.wn-page .wn-staff-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(1.25rem, 3vw, 2.75rem);
	width: min(100%, 65rem);
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.wn-page .wn-staff-card {
	overflow: hidden;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 1px solid var(--wn-staff-line);
	border-radius: clamp(.5rem, 1vw, .75rem);
	background: var(--wn-staff-paper-strong);
	box-shadow: var(--wn-staff-shadow);
}

.wn-page .wn-staff-card__photo {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 0;
	aspect-ratio: 4 / 5;
	background: var(--wn-staff-paper-soft);
}

.wn-page .wn-staff-card__photo::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 72%, oklch(.28 .02 58 / .1));
	content: "";
	pointer-events: none;
}

.wn-page .wn-staff-card__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 25%;
}

.wn-page .wn-staff-card__name {
	position: relative;
	margin: 0;
	padding: clamp(1.1rem, 2.5vw, 1.65rem) 1rem;
	border-top: 1px solid var(--wn-staff-line);
	background: linear-gradient(112deg, var(--wn-staff-paper-strong), var(--wn-staff-paper));
	color: var(--wn-staff-cocoa);
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	font-size: clamp(1.2rem, 2.2vw, 1.55rem);
	font-weight: 700;
	letter-spacing: .14em;
	line-height: 1.4;
	text-align: center;
}

.wn-page .wn-staff-card__name::before {
	position: absolute;
	top: -1px;
	left: 50%;
	width: 3.5rem;
	height: 2px;
	background: var(--wn-staff-gold);
	content: "";
	transform: translateX(-50%);
}

@media screen and (min-width: 22rem) {
	.wn-page .wn-staff-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: clamp(.75rem, 3vw, 2.75rem);
	}
}

@media screen and (min-width: 50rem) {
	.wn-page .wn-staff-section {
		padding-inline: clamp(2rem, 5vw, 4rem);
	}

	.wn-page .wn-staff-grid {
		row-gap: clamp(2.5rem, 4vw, 4rem);
	}
}