/**
 * XYZ Saxophone — 商品 LP（黒系トーン）
 */

.site-main--xyz {
	--xyz-bg: #080808;
	--xyz-bg-soft: #0e0e0e;
	--xyz-bg-card: #141414;
	--xyz-border: rgba( 255, 255, 255, 0.1 );
	--xyz-text: #f2f2f2;
	--xyz-text-muted: rgba( 242, 242, 242, 0.68 );
	--xyz-text-subtle: rgba( 242, 242, 242, 0.45 );
	--xyz-accent: #c9b896;
	--xyz-accent-warm: #b8957a;
	--xyz-highlight: rgba( 201, 184, 150, 0.32 );

	max-width: none;
	padding: 0;
	background: var( --xyz-bg );
}

.xyz-page {
	color: var( --xyz-text );
}

.xyz-section__inner {
	width: min( 100% - clamp( 1.5rem, 6vw, 3rem ), var( --wide-max, 1200px ) );
	margin-inline: auto;
}

.xyz-section__eyebrow {
	margin: 0 0 0.5rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #c9b896;
}

.xyz-page .xyz-section__title {
	margin: 0 0 1rem;
	font-size: clamp( 1.5rem, 3.5vw, 2.25rem );
	font-weight: 700;
	line-height: 1.35;
	color: var( --xyz-text );
}

.xyz-section__title--light,
.xyz-section__title--on-dark {
	color: var( --xyz-text );
}

.xyz-page .xyz-section__lead,
.xyz-page .xyz-section__text {
	margin: 0;
	font-size: clamp( 1rem, 2vw, 1.125rem );
	line-height: 1.85;
	color: var( --xyz-text-muted );
}

/* Hero */
.xyz-hero {
	position: relative;
	min-height: 100vh;
	min-height: 100dvh;
	overflow: hidden;
	--xyz-hero-inset-x: clamp( 2rem, 5.5vw, 3.5rem );
	--xyz-hero-inset-bottom: clamp( 4rem, 10vh, 6rem );
}

.xyz-hero__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.xyz-hero__bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* 縦長原稿: 人物は下部・シア（右）を優先（bottom から少し上へ） */
	object-position: right 90%;
}

.xyz-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		180deg,
		rgba( 8, 8, 8, 0.4 ) 0%,
		rgba( 8, 8, 8, 0.55 ) 45%,
		rgba( 8, 8, 8, 0.92 ) 100%
	);
}

.xyz-hero__figure {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp( 3rem, 8vh, 5rem ) clamp( 1rem, 3vw, 2rem );
	pointer-events: none;
}

.xyz-hero__figure-img {
	display: block;
	width: auto;
	height: min( 58vh, 64dvh );
	max-width: min( 88vw, 28rem );
	object-fit: contain;
	transform: translateY( clamp( 1.5rem, 5vh, 3.5rem ) );
	filter: drop-shadow( 0 24px 48px rgba( 0, 0, 0, 0.45 ) );
}

.xyz-hero__title {
	position: absolute;
	left: var( --xyz-hero-inset-x );
	bottom: var( --xyz-hero-inset-bottom );
	z-index: 3;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.1em;
	font-family: "Outfit", var( --font-sans );
	line-height: 0.95;
	text-align: left;
	pointer-events: none;
}

.xyz-hero__title-brand {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
}

.xyz-hero__logo {
	display: block;
	width: clamp( 3.5rem, 12vw, 6.5rem );
	margin: 0 0 clamp( 0.2rem, 0.8vw, 0.4rem );
	color: #fff;
	transform: translateY( -0.65rem );
	filter: drop-shadow( 0 4px 20px rgba( 0, 0, 0, 0.35 ) );
}

.xyz-hero__logo svg {
	display: block;
	width: 100%;
	height: auto;
}

.xyz-hero__title-main {
	font-size: clamp( 4.5rem, 18vw, 9rem );
	font-weight: 900;
	letter-spacing: -0.04em;
	color: #fff;
	text-shadow: 0 8px 40px rgba( 0, 0, 0, 0.35 );
}

.xyz-hero__title-sub {
	font-size: clamp( 1.25rem, 4vw, 2rem );
	font-weight: 600;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: rgba( 255, 255, 255, 0.88 );
}

/* Buttons */
.xyz-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.85rem;
	padding: 0 1.5rem;
	border-radius: 999px;
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.xyz-btn--primary {
	background: #c9b896;
	color: #1a2b48;
	border: 2px solid #c9b896;
}

.xyz-btn--primary:hover,
.xyz-btn--primary:focus-visible {
	background: #e8d4b0;
	border-color: #e8d4b0;
	transform: translateY( -2px );
}

.xyz-btn--ghost {
	background: transparent;
	color: #fff;
	border: 2px solid rgba( 255, 255, 255, 0.65 );
}

.xyz-btn--ghost:hover,
.xyz-btn--ghost:focus-visible {
	background: rgba( 255, 255, 255, 0.12 );
	border-color: #fff;
}

.xyz-page .xyz-btn--outline {
	background: transparent;
	color: var( --xyz-text );
	border: 2px solid rgba( 255, 255, 255, 0.45 );
}

.xyz-page .xyz-btn--outline:hover,
.xyz-page .xyz-btn--outline:focus-visible {
	background: var( --xyz-text );
	color: var( --xyz-bg );
}

.xyz-link-arrow {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-decoration: none;
	color: #c9b896;
	border-bottom: 1px solid rgba( 201, 184, 150, 0.45 );
	transition: color 0.2s ease, border-color 0.2s ease;
}

.xyz-link-arrow:hover,
.xyz-link-arrow:focus-visible {
	color: #e8d4b0;
	border-color: #e8d4b0;
}

.xyz-link-arrow--external {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
}

.xyz-link-arrow__icon {
	display: inline-flex;
	flex: 0 0 auto;
	width: 0.95em;
	height: 0.95em;
}

.xyz-link-arrow__icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.xyz-link-arrow--external:hover .xyz-link-arrow__icon,
.xyz-link-arrow--external:focus-visible .xyz-link-arrow__icon {
	transform: translate( 1px, -1px );
}

/* Catch（文字のみ・中央揃え） */
.xyz-catch {
	padding: clamp( 4.5rem, 14vh, 7.5rem ) clamp( 1.25rem, 4vw, 2rem );
	background: var( --xyz-bg );
	text-align: center;
}

.xyz-catch__inner {
	width: min( 100%, 40rem );
	margin-inline: auto;
}

.xyz-catch__eyebrow {
	margin: 0 0 clamp( 2rem, 5vw, 3rem );
	font-size: 0.6875rem;
	font-weight: 400;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var( --xyz-text-subtle );
}

.xyz-catch__headline {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.2em;
	font-size: clamp( 1.375rem, 3.2vw, 1.875rem );
	font-weight: 600;
	line-height: 1.65;
	letter-spacing: 0.04em;
	color: var( --xyz-text );
}

.xyz-catch__headline-line {
	display: block;
}

.xyz-catch__mark {
	position: relative;
	display: inline;
	white-space: nowrap;
}

.xyz-catch__mark::before {
	content: "";
	position: absolute;
	left: -0.08em;
	right: -0.08em;
	bottom: 0.08em;
	height: 0.42em;
	background: var( --xyz-highlight );
	z-index: -1;
}

.xyz-catch__subhead {
	margin: clamp( 2.5rem, 6vw, 3.5rem ) 0 0;
	font-size: clamp( 0.9375rem, 2vw, 1.0625rem );
	font-weight: 500;
	line-height: 1.85;
	letter-spacing: 0.03em;
	color: var( --xyz-text );
}

.xyz-catch__lead {
	margin: 0.85em auto 0;
	max-width: 32em;
	font-size: clamp( 0.875rem, 1.7vw, 0.9375rem );
	font-weight: 400;
	line-height: 1.9;
	color: var( --xyz-text-muted );
}

/* Philosophy — 縦動画 + テキスト（左に読みやすさ用スクリム） */
.xyz-philosophy {
	position: relative;
	overflow: hidden;
	padding: clamp( 4rem, 12vh, 7rem ) 0;
	background: var( --xyz-bg-soft );
	color: var( --xyz-text );
}

.xyz-philosophy__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax( 0, 1.2fr ) minmax( 12.5rem, min( 36vw, 26rem ) );
	gap: clamp( 1.5rem, 4vw, 3rem );
	align-items: center;
}

.xyz-philosophy__copy {
	position: relative;
	z-index: 1;
	padding-block: clamp( 0.5rem, 2vw, 1.5rem );
}

.xyz-philosophy__copy::before {
	content: '';
	position: absolute;
	z-index: -1;
	inset: -1.5rem -2rem -1.5rem -50vw;
	background: linear-gradient(
		105deg,
		var( --xyz-bg-soft ) 0%,
		var( --xyz-bg-soft ) 42%,
		rgba( 12, 12, 14, 0.92 ) 68%,
		rgba( 12, 12, 14, 0.55 ) 82%,
		transparent 100%
	);
	pointer-events: none;
}

.xyz-philosophy__eyebrow {
	margin: 0 0 1.25rem;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var( --xyz-accent-warm );
}

.xyz-philosophy__headline {
	margin: 0 0 clamp( 1.25rem, 3vw, 1.75rem );
	font-size: clamp( 1.25rem, 2.8vw, 1.625rem );
	font-weight: 700;
	line-height: 1.55;
	letter-spacing: 0.02em;
	color: var( --xyz-text );
}

.xyz-philosophy__headline-line {
	display: block;
}

.xyz-philosophy__body-intro,
.xyz-philosophy__body {
	margin: 0;
	max-width: 28em;
	font-size: clamp( 0.875rem, 1.7vw, 0.9375rem );
	font-weight: 400;
	line-height: 1.9;
	color: var( --xyz-text-muted );
}

.xyz-philosophy__body {
	margin-top: 1em;
}

.xyz-philosophy__more {
	margin: clamp( 1.25rem, 3vw, 1.75rem ) 0 0;
}

.xyz-philosophy__video-wrap {
	position: relative;
	justify-self: end;
	width: 100%;
	max-width: min( 100%, 26rem );
	max-height: min( 82vh, 46rem );
	aspect-ratio: 9 / 16;
	overflow: hidden;
	border: 1px solid rgba( 255, 255, 255, 0.08 );
	background: #000;
	box-shadow:
		0 1.5rem 3.5rem rgba( 0, 0, 0, 0.45 ),
		0 0 0 1px rgba( 255, 255, 255, 0.04 ) inset;
}

.xyz-philosophy__video-wrap::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		180deg,
		rgba( 0, 0, 0, 0.2 ) 0%,
		transparent 18%,
		transparent 78%,
		rgba( 0, 0, 0, 0.35 ) 100%
	);
	pointer-events: none;
}

.xyz-philosophy__video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

@media ( prefers-reduced-motion: reduce ) {
	.xyz-philosophy__video {
		display: none;
	}

	.xyz-philosophy__video-wrap {
		min-height: clamp( 14rem, 50vw, 20rem );
		background: var( --xyz-bg-card );
	}
}

/* Profiles — フリップカード */
.xyz-profiles {
	padding: clamp( 4rem, 12vh, 7rem ) 0;
	background: var( --xyz-bg-soft );
}

.xyz-profiles__eyebrow {
	margin: 0 0 clamp( 1.5rem, 4vw, 2.5rem );
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-align: center;
	color: var( --xyz-accent-warm );
}

.xyz-profiles__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: clamp( 1.5rem, 4vw, 2.5rem );
	justify-items: center;
}

.xyz-profile-flip {
	margin: 0;
	width: 100%;
	max-width: min( 100%, 34rem );
}

.xyz-profile-flip__scene {
	perspective: 800px;
	width: 100%;
	outline: none;
}

.xyz-profile-flip__card {
	position: relative;
	width: 100%;
	aspect-ratio: 7 / 4;
	background: var( --xyz-bg-card );
	border: 1px solid var( --xyz-border );
	border-radius: 8px;
	box-shadow: 0 12px 32px rgba( 0, 0, 0, 0.45 );
	transform-style: preserve-3d;
	transition: transform 0.6s ease;
}

.xyz-profile-flip__scene:hover .xyz-profile-flip__card,
.xyz-profile-flip__scene:focus-within .xyz-profile-flip__card {
	transform: rotateY( -180deg ) translateZ( 1px );
}

.xyz-profile-flip__side {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 8px;
	backface-visibility: hidden;
	transform: rotate( 0deg ) translateZ( 1px );
	overflow: hidden;
}

.xyz-profile-flip__front {
	position: relative;
	background: var( --xyz-bg );
}

.xyz-profile-flip__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.xyz-profile-flip--matsushita .xyz-profile-flip__img {
	object-position: left center;
}

.xyz-profile-flip__front-label {
	position: absolute;
	top: 58%;
	right: clamp( 1rem, 4vw, 2.25rem );
	z-index: 1;
	margin: 0;
	max-width: 42%;
	transform: translateY( -50% );
	font-family: var( --font-sans );
	font-size: clamp( 1rem, 2.2vw, 1.375rem );
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: 0.12em;
	text-align: right;
	color: rgba( 255, 255, 255, 0.92 );
	text-shadow: 0 1px 8px rgba( 0, 0, 0, 0.45 );
	pointer-events: none;
}

.xyz-profile-flip--nikita .xyz-profile-flip__front-label {
	left: clamp( 1rem, 4vw, 2.25rem );
	right: auto;
	text-align: left;
}

.xyz-profile-flip__img-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var( --xyz-bg );
}

.xyz-profile-flip__img-placeholder span {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	color: rgba( 255, 255, 255, 0.35 );
}

.xyz-profile-flip__back {
	display: flex;
	flex-direction: column;
	background: linear-gradient( 165deg, #161616 0%, #0a0a0a 100% );
	padding: clamp( 1.25rem, 3vw, 1.75rem );
	transform: rotateY( 180deg ) translateZ( 1px );
}

.xyz-profile-flip__name {
	flex-shrink: 0;
	margin: 0 0 0.85rem;
	padding-right: 0.25rem;
	font-family: "Outfit", var( --font-sans );
	font-size: clamp( 1.125rem, 2.6vw, 1.375rem );
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.04em;
	color: var( --xyz-text );
}

.xyz-profile-flip__info {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba( 201, 184, 150, 0.35 ) transparent;
}

.xyz-profile-flip__name-ja {
	margin: 0 0 0.75rem;
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.06em;
	color: var( --xyz-accent );
}

.xyz-profile-flip__bio {
	margin: 0;
	font-family: var( --font-sans );
	font-size: clamp( 0.8125rem, 1.6vw, 0.875rem );
	font-weight: 400;
	line-height: 1.75;
	color: var( --xyz-text-muted );
}

/* Lineup */
.xyz-lineup {
	padding: clamp( 4rem, 12vh, 7rem ) 0;
	background: var( --xyz-bg );
}

.xyz-lineup__header {
	margin: 0 0 clamp( 2rem, 5vw, 3rem );
	text-align: center;
}

.xyz-lineup__title {
	margin: 0;
	font-family: var( --font-sans );
	font-size: clamp( 0.8125rem, 1.8vw, 0.9375rem );
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var( --xyz-accent-warm );
}

.xyz-lineup__subtitle {
	margin: 0.65rem 0 0;
	font-size: clamp( 1.125rem, 2.5vw, 1.5rem );
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: 0.08em;
	color: var( --xyz-text );
}

.xyz-lineup__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	gap: clamp( 1rem, 2.5vw, 1.25rem );
}

.xyz-lineup-card {
	margin: 0;
}

.xyz-lineup-card__link {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	background: var( --xyz-bg-card );
	border: 1px solid var( --xyz-border );
	color: var( --xyz-text );
	text-decoration: none;
	transition: border-color 0.2s ease, transform 0.2s ease;
}

.xyz-lineup-card__link:hover,
.xyz-lineup-card__link:focus-visible {
	border-color: rgba( 201, 184, 150, 0.45 );
	transform: translateY( -3px );
}

.xyz-lineup-card__visual {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: clamp( 11rem, 24vw, 16rem );
	min-height: 0;
	background: rgba( 255, 255, 255, 0.06 );
	overflow: hidden;
}

.xyz-lineup-card__img {
	display: block;
	width: auto;
	height: auto;
	max-width: 82%;
	max-height: 94%;
	object-fit: contain;
	object-position: center;
	padding: clamp( 0.5rem, 1.2vw, 0.85rem );
}

.xyz-lineup-card__visual-label {
	padding: 0 1rem;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: center;
	color: var( --xyz-text-subtle );
}

.xyz-lineup-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: clamp( 1rem, 2.5vw, 1.25rem ) clamp( 1rem, 2.5vw, 1.35rem ) 0;
}

.xyz-lineup-card__meta {
	margin: 0 0 0.5rem;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var( --xyz-text-subtle );
}

.xyz-lineup-card__title {
	margin: 0 0 0.65rem;
	font-family: "Outfit", var( --font-sans );
	font-size: clamp( 1.25rem, 2.8vw, 1.5rem );
	font-weight: 700;
	line-height: 1.2;
	color: var( --xyz-text );
}

.xyz-lineup-card__desc {
	margin: 0 0 1rem;
	flex: 1;
	font-size: clamp( 0.8125rem, 1.6vw, 0.875rem );
	line-height: 1.75;
	color: var( --xyz-text-muted );
}

.xyz-lineup-card__cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
	padding: 0.85rem 0;
	border-top: 1px solid var( --xyz-border );
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var( --xyz-text-muted );
	transition: color 0.2s ease;
}

.xyz-lineup-card__link:hover .xyz-lineup-card__cta,
.xyz-lineup-card__link:focus-visible .xyz-lineup-card__cta {
	color: var( --xyz-accent );
}

/* Artists — LP 自動マルキー（無限ループ） */
.xyz-artists {
	padding: clamp( 4rem, 12vh, 7rem ) 0;
	background: var( --xyz-bg );
	text-align: center;
}

.xyz-artists .xyz-section__eyebrow {
	color: var( --xyz-accent );
}

.xyz-artists__note {
	margin: 0;
	font-size: 1rem;
	color: var( --xyz-text-muted );
}

.xyz-artists__actions {
	margin: clamp( 1.75rem, 4vw, 2.5rem ) 0 0;
}

.xyz-artists-marquee {
	margin-top: clamp( 2rem, 5vw, 3rem );
	margin-inline: calc( -1 * clamp( 0.75rem, 3vw, 1.5rem ) );
	padding-inline: clamp( 0.75rem, 3vw, 1.5rem );
	overflow: hidden;
	-webkit-mask-image: linear-gradient( 90deg, transparent 0%, #000 2%, #000 98%, transparent 100% );
	mask-image: linear-gradient( 90deg, transparent 0%, #000 2%, #000 98%, transparent 100% );
}

.xyz-artists-marquee__inner {
	display: flex;
	width: max-content;
	will-change: transform;
	animation: xyz-artists-marquee var( --xyz-marquee-duration, 36s ) linear infinite;
}

.xyz-artists-marquee__gap {
	flex: 0 0 auto;
	width: var( --xyz-marquee-gap, clamp( 1.15rem, 2.6vw, 1.65rem ) );
}

.xyz-artists-marquee:hover .xyz-artists-marquee__inner {
	animation-play-state: paused;
}

@keyframes xyz-artists-marquee {
	from {
		transform: translateX( 0 );
	}
	to {
		transform: translateX( calc( -1 * var( --xyz-marquee-shift, 50% ) ) );
	}
}

.xyz-artists-scroll__track {
	list-style: none;
	margin: 0;
	padding: 0.25rem 0 1rem;
	display: flex;
	gap: clamp( 1.15rem, 2.6vw, 1.65rem );
	width: max-content;
	flex: 0 0 auto;
}

.xyz-artists-scroll__item {
	flex: 0 0 auto;
	width: clamp( 9.5rem, 28vw, 12.5rem );
}

.xyz-artists-scroll__card {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	text-align: left;
}

.xyz-artists-scroll__visual {
	display: block;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	background: var( --xyz-bg-card );
	border: 0;
}

.xyz-artists-scroll__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.xyz-artists-scroll__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 2rem;
	font-weight: 600;
	color: var( --xyz-text-subtle );
	background: rgba( 255, 255, 255, 0.04 );
}

.xyz-artists-scroll__name {
	display: block;
	margin-top: 0.65rem;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.35;
	color: var( --xyz-text );
}

.xyz-artists-scroll__country {
	display: block;
	margin-top: 0.2rem;
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	color: var( --xyz-text-subtle );
}

/* Artists — 一覧ページ */
.xyz-subpage-hero {
	padding: clamp( 5rem, 14vh, 7rem ) 0 clamp( 2rem, 5vh, 3rem );
	background: var( --xyz-bg );
	border-bottom: 1px solid var( --xyz-border );
}

.xyz-subpage-hero__eyebrow {
	margin: 0 0 0.55rem;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.xyz-subpage-hero__back {
	color: var( --xyz-accent );
	text-decoration: none;
	cursor: default;
}

.xyz-subpage-hero__back:hover,
.xyz-subpage-hero__back:focus-visible {
	text-decoration: none;
}

.xyz-subpage-hero__title {
	margin: 0;
	font-size: clamp( 1.75rem, 4vw, 2.5rem );
	font-weight: 700;
	line-height: 1.25;
	color: var( --xyz-text );
}

.xyz-breadcrumb {
	margin: 0 0 1.25rem;
	display: flex;
	gap: 0.65rem;
	align-items: center;
	font-family: var( --font-sans );
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var( --xyz-text-subtle );
}

.xyz-breadcrumb__link {
	color: var( --xyz-accent-warm );
	text-decoration: none;
}

.xyz-breadcrumb__link:hover,
.xyz-breadcrumb__link:focus-visible {
	text-decoration: none;
}

.xyz-breadcrumb__sep {
	color: var( --xyz-text-subtle );
}

.xyz-breadcrumb__current {
	color: var( --xyz-text-muted );
	text-transform: none;
	letter-spacing: 0.06em;
}

.xyz-subpage-hero__lead {
	margin: 0.75rem 0 0;
	font-size: 1rem;
	color: var( --xyz-text-muted );
}

.xyz-artists-archive {
	padding: clamp( 2.5rem, 8vh, 4rem ) 0 clamp( 4rem, 10vh, 6rem );
	background: var( --xyz-bg );
}

.xyz-artist-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( min( 100%, 10.5rem ), 1fr ) );
	gap: clamp( 1rem, 2.5vw, 1.5rem );
	max-width: min( 60rem, 100% );
	margin-inline: auto;
}

.xyz-artist-grid__cell {
	margin: 0;
}

.xyz-artist-grid__item {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	text-align: left;
	cursor: pointer;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

.xyz-artist-grid__item:hover,
.xyz-artist-grid__item:focus-visible {
	transform: translateY( -3px );
	opacity: 0.92;
}

.xyz-artist-grid__visual {
	display: block;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	background: var( --xyz-bg-card );
	border: 0;
}

.xyz-artist-grid__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.xyz-artist-grid__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 2rem;
	font-weight: 600;
	color: var( --xyz-text-subtle );
}

.xyz-artist-grid__name {
	display: block;
	margin-top: 0.65rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var( --xyz-text );
}

.xyz-artist-grid__country {
	display: block;
	margin-top: 0.2rem;
	font-size: 0.75rem;
	color: var( --xyz-text-subtle );
}

/* Artist modal */
html.xyz-artist-modal-open {
	overflow: hidden;
}

.xyz-artist-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp( 1rem, 4vw, 2rem );
	opacity: 0;
	transition: opacity 0.28s cubic-bezier( 0.2, 0.7, 0.2, 1 );
}

.xyz-artist-modal[hidden] {
	display: none;
}

.xyz-artist-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba( 0, 0, 0, 0.72 );
	opacity: 0;
	transition: opacity 0.28s cubic-bezier( 0.2, 0.7, 0.2, 1 );
}

.xyz-artist-modal__dialog {
	position: relative;
	z-index: 1;
	width: min( 100%, 52rem );
	max-height: min( 90vh, 44rem );
	overflow: auto;
	background: var( --xyz-bg-card );
	border: 1px solid var( --xyz-border );
	box-shadow: 0 24px 64px rgba( 0, 0, 0, 0.55 );
	transform: translateY( 14px ) scale( 0.985 );
	opacity: 0;
	transition: transform 0.34s cubic-bezier( 0.16, 1, 0.3, 1 ), opacity 0.28s cubic-bezier( 0.2, 0.7, 0.2, 1 );
}

.xyz-artist-modal.is-open {
	opacity: 1;
}

.xyz-artist-modal.is-open .xyz-artist-modal__backdrop {
	opacity: 1;
}

.xyz-artist-modal.is-open .xyz-artist-modal__dialog {
	transform: translateY( 0 ) scale( 1 );
	opacity: 1;
}

.xyz-artist-modal.is-out {
	opacity: 0;
}

.xyz-artist-modal.is-out .xyz-artist-modal__backdrop {
	opacity: 0;
}

.xyz-artist-modal.is-out .xyz-artist-modal__dialog {
	transform: translateY( 10px ) scale( 0.99 );
	opacity: 0;
}

.xyz-artist-modal__social-link[hidden] {
	display: none !important;
}

.xyz-artist-modal__close {
	position: absolute;
	top: 0.65rem;
	right: 0.65rem;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	margin: 0;
	padding: 0;
	border: 1px solid var( --xyz-border );
	background: rgba( 8, 8, 8, 0.85 );
	color: var( --xyz-text );
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
}

.xyz-artist-modal__layout {
	display: grid;
	grid-template-columns: minmax( 0, 11rem ) minmax( 0, 1fr );
	gap: clamp( 1rem, 3vw, 1.75rem );
	padding: clamp( 1.25rem, 3vw, 2rem );
}

.xyz-artist-modal__media {
	min-height: 0;
}

.xyz-artist-modal__social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-top: 0.75rem;
}

.xyz-artist-modal__social[hidden] {
	display: none;
}

.xyz-artist-modal__social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	border-radius: 0;
	border: 0;
	background: transparent;
	color: var( --xyz-text );
	text-decoration: none;
	opacity: 0.92;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.xyz-artist-modal__social-link svg {
	display: block;
	width: 1.35rem;
	height: 1.35rem;
}

/* SNSアイコンは白一色で統一（fillはpath中心、strokeは線画も対応） */
.xyz-artist-modal__social-link svg path {
	fill: currentColor;
}

.xyz-artist-modal__social-link svg path,
.xyz-artist-modal__social-link svg line,
.xyz-artist-modal__social-link svg polyline,
.xyz-artist-modal__social-link svg polygon,
.xyz-artist-modal__social-link svg circle,
.xyz-artist-modal__social-link svg rect {
	stroke: currentColor;
}

/* Facebookは「円＋抜き」前提のSVGなので、外周は塗らずFだけ白にする */
.xyz-artist-modal__social-link[data-xyz-artist-social-link="facebook"] svg #Initiator {
	fill: currentColor !important;
	stroke: none !important;
}

.xyz-artist-modal__social-link[data-xyz-artist-social-link="facebook"] svg #F {
	fill: none !important;
	stroke: none !important;
}

.xyz-artist-modal__social-link:hover,
.xyz-artist-modal__social-link:focus-visible {
	opacity: 1;
	transform: translateY( -1px );
}

.xyz-artist-modal__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	border: 0;
}

.xyz-artist-modal__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 2 / 3;
	font-size: 2.5rem;
	font-weight: 600;
	color: var( --xyz-text-subtle );
	background: rgba( 255, 255, 255, 0.05 );
	border: 0;
}

.xyz-artist-modal__country {
	margin: 0 0 0.35rem;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var( --xyz-accent );
}

.xyz-artist-modal__country[hidden],
.xyz-artist-modal__placeholder[hidden],
.xyz-artist-modal__name-sub[hidden],
.xyz-artist-modal__profile[hidden] {
	display: none;
}

.xyz-artist-modal__title {
	margin: 0 0 0.35rem;
	font-size: clamp( 1.25rem, 3vw, 1.65rem );
	font-weight: 700;
	line-height: 1.3;
	color: var( --xyz-text );
}

.xyz-artist-modal__name-sub {
	margin: 0 0 1rem;
	font-size: 0.875rem;
	color: var( --xyz-text-muted );
}

.xyz-artist-modal__profile {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.85;
	color: var( --xyz-text-muted );
	white-space: pre-line;
}

/* Dealers — 明るいセクション */
.xyz-dealers {
	--xyz-dealers-bg: #f2ede4;
	--xyz-dealers-card: #faf8f4;
	--xyz-dealers-text: #1c1c1c;
	--xyz-dealers-muted: rgba( 28, 28, 28, 0.62 );
	--xyz-dealers-border: rgba( 28, 28, 28, 0.1 );

	padding: clamp( 4rem, 12vh, 6rem ) 0;
	background: var( --xyz-dealers-bg );
	color: var( --xyz-dealers-text );
	text-align: center;
}

.xyz-dealers .xyz-section__eyebrow {
	color: #8a6f52;
}

.xyz-dealers .xyz-section__title {
	color: var( --xyz-dealers-text );
}

.xyz-dealers__toolbar {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: clamp( 1.5rem, 4vw, 2rem );
}

.xyz-dealers__filter-label {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --xyz-dealers-muted );
}

.xyz-dealers__filter {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 0.75rem;
}

.xyz-dealers__filter-item {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.4rem 0.7rem;
	border: 1px solid var( --xyz-dealers-border );
	border-radius: 999px;
	background: var( --xyz-dealers-card );
	color: var( --xyz-dealers-text );
	font-size: 0.8125rem;
	font-weight: 600;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease;
}

.xyz-dealers__filter-item:has( input:checked ) {
	border-color: rgba( 28, 28, 28, 0.28 );
	background: #ffffff;
}

.xyz-dealers__filter-item input {
	margin: 0;
	accent-color: var( --xyz-dealers-text );
}

.xyz-dealers__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( min( 100%, 18rem ), 1fr ) );
	gap: clamp( 1rem, 2.5vw, 1.25rem );
	text-align: left;
}

.xyz-dealers__hint {
	margin: 0.75rem 0 0;
	font-size: 0.875rem;
	line-height: 1.6;
	color: var( --xyz-dealers-muted );
	text-align: center;
}

.xyz-dealers__empty {
	margin: 0.5rem 0 0;
	font-size: 0.9375rem;
	color: var( --xyz-dealers-muted );
	text-align: center;
}

.xyz-dealers__empty[hidden] {
	display: none;
}

.xyz-dealer-card {
	margin: 0;
	padding: clamp( 1.15rem, 2.5vw, 1.35rem );
	background: var( --xyz-dealers-card );
	border: 0;
	box-shadow: 0 2px 16px rgba( 28, 28, 28, 0.05 );
}

.xyz-dealer-flip {
	margin: 0;
}

.xyz-dealer-flip__scene {
	display: block;
	color: inherit;
	text-decoration: none;
	outline: none;
	perspective: 900px;
	-webkit-perspective: 900px;
	position: relative;
}

.xyz-dealer-flip__card {
	position: relative;
	width: 100%;
	min-height: 12.5rem;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	transition: transform 0.62s cubic-bezier( 0.2, 0.7, 0.2, 1 );
	will-change: transform;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.xyz-dealer-flip__scene:hover > .xyz-dealer-flip__card,
.xyz-dealer-flip__scene:focus-visible > .xyz-dealer-flip__card {
	transform: rotateY( -180deg ) translateZ( 1px );
}

.xyz-dealer-flip__link {
	position: absolute;
	inset: 0;
	z-index: 3;
	border-radius: 0;
}

.xyz-dealer-flip__tel {
	position: relative;
	z-index: 4;
}

.xyz-dealer-flip__scene:hover .xyz-dealer-flip__link,
.xyz-dealer-flip__scene:focus-visible .xyz-dealer-flip__link {
	outline: none;
}

.xyz-dealer-flip__side {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transform: translateZ( 1px );
	-webkit-transform: translateZ( 1px );
}

.xyz-dealer-flip__front {
	position: relative;
	padding: clamp( 1.15rem, 2.5vw, 1.35rem );
	background: var( --xyz-dealers-card );
	border: 0;
	border-radius: 8px;
	box-shadow: 0 2px 16px rgba( 28, 28, 28, 0.05 );
}

.xyz-dealer-flip__back {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #0f0f10;
	border: 0;
	border-radius: 8px;
	transform: rotateY( 180deg ) translateZ( 1px );
	-webkit-transform: rotateY( 180deg ) translateZ( 1px );
	padding: 0;
	overflow: hidden;
}

.xyz-dealer-flip__logo {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.xyz-dealer-flip__logo-svg {
	display: block;
	width: 100%;
	height: 100%;
	color: #fff;
	opacity: 0.92;
}

.xyz-dealer-flip__logo-svg svg {
	display: block;
	width: 100%;
	height: 100%;
}

.xyz-dealer-flip__logo-text {
	font-family: "Outfit", var( --font-sans );
	font-size: 2.25rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	color: #fff;
}

.xyz-dealer-flip__scene:hover .xyz-dealer-flip__card {
	box-shadow: 0 10px 28px rgba( 28, 28, 28, 0.12 );
}

.xyz-dealer-card__region {
	margin: 0 0 0.35rem;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #8a6f52;
}

.xyz-dealer-card__name {
	margin: 0 0 0.65rem;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	color: var( --xyz-dealers-text );
}

.xyz-dealer-card__address,
.xyz-dealer-card__phone {
	margin: 0 0 0.5rem;
	font-size: 0.875rem;
	line-height: 1.7;
	color: var( --xyz-dealers-muted );
}

.xyz-dealer-card__phone a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.xyz-dealer-flip__scene:hover .xyz-dealer-card__phone a,
.xyz-dealer-flip__scene:focus-visible .xyz-dealer-card__phone a {
	text-decoration: underline;
}

.xyz-dealer-card__status {
	list-style: none;
	margin: 0.85rem 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.xyz-dealer-card__status li {
	padding: 0.2rem 0.55rem;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	color: #5c4a38;
	background: rgba( 201, 184, 150, 0.28 );
	border: 1px solid rgba( 138, 111, 82, 0.22 );
}

.xyz-dealers__note {
	margin: 0 auto;
	max-width: 32em;
	font-size: 1rem;
	line-height: 1.8;
	color: var( --xyz-dealers-muted );
}

.xyz-dealers__contact {
	margin: 1.75rem 0 0;
}

.xyz-dealers .xyz-btn--outline {
	color: var( --xyz-dealers-text );
	border-color: rgba( 28, 28, 28, 0.35 );
}

.xyz-dealers .xyz-btn--outline:hover,
.xyz-dealers .xyz-btn--outline:focus-visible {
	background: var( --xyz-dealers-text );
	color: var( --xyz-dealers-bg );
	border-color: var( --xyz-dealers-text );
}

/* Editor追加ブロック */
.xyz-page__editor {
	max-width: var( --wide-max, 1200px );
	margin: 0 auto;
	padding: var( --space-section, 3rem ) clamp( 1rem, 4vw, 2rem );
	background: var( --xyz-bg );
	color: var( --xyz-text );
}

.xyz-page__editor.entry-content a {
	color: var( --xyz-accent );
}

@media ( max-width: 900px ) {
	.xyz-philosophy__inner {
		grid-template-columns: 1fr;
		justify-items: center;
		gap: clamp( 2rem, 6vw, 2.75rem );
	}

	.xyz-philosophy__copy {
		order: 1;
		width: 100%;
	}

	.xyz-philosophy__copy::before {
		inset: -1rem -1.25rem;
		background: linear-gradient(
			180deg,
			var( --xyz-bg-soft ) 0%,
			rgba( 12, 12, 14, 0.94 ) 55%,
			var( --xyz-bg-soft ) 100%
		);
	}

	.xyz-philosophy__video-wrap {
		order: 2;
		justify-self: center;
		max-width: min( 72vw, 20rem );
		max-height: min( 70vh, 36rem );
	}

	.xyz-profiles__list,
	.xyz-lineup__grid {
		grid-template-columns: 1fr;
	}

	.xyz-profile-flip {
		max-width: min( 100%, 30rem );
	}
}

@media ( min-width: 1100px ) {
	.xyz-profile-flip {
		max-width: min( 100%, 38rem );
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.xyz-profile-flip__card {
		transition: none;
	}

	.xyz-artists-marquee__inner {
		animation: none;
		transform: none;
	}

	.xyz-profile-flip__scene:hover .xyz-profile-flip__card,
	.xyz-profile-flip__scene:focus-within .xyz-profile-flip__card {
		transform: none;
	}

	.xyz-profile-flip__back {
		position: relative;
		inset: auto;
		height: auto;
		transform: none;
		margin-top: 0.75rem;
		border-radius: 8px;
	}

	.xyz-profile-flip__front {
		position: relative;
		inset: auto;
		aspect-ratio: 7 / 4;
	}

	.xyz-profile-flip__card {
		display: flex;
		flex-direction: column;
		height: auto;
		aspect-ratio: auto;
		transform-style: flat;
	}

	.xyz-profile-flip__side {
		position: relative;
		transform: none;
		backface-visibility: visible;
	}
}

@media ( max-width: 767px ) {
	/* SP: 横は中央。縦は人物（下部）を残す */
	.xyz-hero__bg-img {
		object-position: center 90%;
	}
}

@media ( max-width: 640px ) {

	.xyz-hero__figure-img {
		height: min( 48vh, 52dvh );
		max-width: min( 84vw, 18rem );
	}

	.xyz-hero__title-main {
		font-size: clamp( 3.25rem, 16vw, 5rem );
	}

	.xyz-hero__title-sub {
		font-size: clamp( 1rem, 3.5vw, 1.35rem );
		letter-spacing: 0.18em;
	}

	.xyz-artist-modal__layout {
		grid-template-columns: 1fr;
	}

	.xyz-artist-modal__media {
		max-width: 12rem;
		margin-inline: auto;
	}

	.xyz-dealers__list {
		grid-template-columns: 1fr;
	}

}
