@charset "UTF-8";
/**
 * LUXE ENTRY About ページ（About (LUXE)）スタイル
 *
 * About.dc.html デザインの移植。templates/page-about.php でのみ読み込む
 * （inc/setup.php で条件付き enqueue）。ヒーロー・ステップ・CTA は
 * css/style.css の共通部品（.luxe-hero / .luxe-steps / .luxe-cta）を再利用する。
 */

/* ============================================================
 * ③ プロフィール（写真 + メッセージ + 代表情報テーブル）
 * ============================================================ */
.luxe-about-profile {
	padding: 60px var(--luxe-pad-x) 110px;
	max-width: var(--luxe-maxw);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 0.86fr 1.14fr;
	gap: 80px;
	align-items: start;
}

.luxe-about-profile__figure {
	position: relative;
}

.luxe-about-profile__dots {
	width: 112px;
	height: 112px;
}

.luxe-about-profile__img {
	display: block;
	width: 100%;
	height: 560px;
	object-fit: cover;
	position: relative;
	z-index: 1;
}

/* 写真未支給時のプレースホルダー（images/about-representative.jpg 配置で自動反映） */
.luxe-about-profile__placeholder {
	position: relative;
	z-index: 1;
	height: 560px;
	background: var(--luxe-bg-band);
	display: flex;
	align-items: center;
	justify-content: center;
}

.luxe-about-profile__placeholder span {
	font-family: var(--luxe-label);
	font-size: 12px;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--luxe-gold-3);
}

.luxe-about-profile__caption {
	position: relative;
	z-index: 1;
	margin-top: 26px;
	text-align: center;
}

.luxe-about-profile__script {
	font-size: 38px;
	line-height: 0.9;
	margin-bottom: 0;
}

.luxe-about-profile__name {
	font-family: var(--luxe-mincho-head);
	font-weight: 500;
	font-size: 22px;
	letter-spacing: 0.1em;
	color: var(--luxe-ink);
	margin-top: 6px;
}

.luxe-about-profile__role {
	font-family: var(--luxe-label);
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--luxe-gold-3);
	margin-top: 8px;
}

.luxe-about-profile__label {
	display: block;
	margin-bottom: 14px;
}

.luxe-about-profile__title {
	font-family: var(--luxe-mincho-head);
	font-weight: 500;
	font-size: 27px;
	letter-spacing: 0.05em;
	color: var(--luxe-ink);
	line-height: 1.6;
	margin-bottom: 26px;
}

.luxe-about-profile__text {
	font-size: 14.5px;
	line-height: 2.2;
	color: #5f574b;
	margin-bottom: 18px;
}

.luxe-about-profile__text--last {
	margin-bottom: 40px;
}

/* 代表情報テーブル */
.luxe-about-table {
	border-top: 1px solid rgba(122, 108, 93, 0.24);
}

.luxe-about-table__row {
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: 24px;
	padding: 18px 0;
	border-bottom: 1px solid rgba(122, 108, 93, 0.24);
}

.luxe-about-table__row:last-child {
	border-bottom: none;
}

.luxe-about-table__key {
	font-family: var(--luxe-label);
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--luxe-gold-3);
	padding-top: 2px;
}

.luxe-about-table__val {
	font-size: 14px;
	color: var(--luxe-ink-soft);
	line-height: 1.8;
}

/* ============================================================
 * ④ 大切にしていること（暗背景・共通 .luxe-steps のバリアント）
 * ============================================================ */
.luxe-about-values {
	background: var(--luxe-dark);
	color: #ece4d8;
	padding: 110px var(--luxe-pad-x);
}

.luxe-about-values__inner {
	max-width: var(--luxe-maxw);
	margin: 0 auto;
}

.luxe-about-values__head {
	text-align: center;
	margin-bottom: 60px;
}

.luxe-about-values__script {
	font-size: 42px;
	color: var(--luxe-gold-2);
	margin-bottom: 8px;
}

.luxe-about-values__title {
	font-family: var(--luxe-serif);
	font-weight: 500;
	font-size: 42px;
	color: #f4eee5;
	letter-spacing: 0.04em;
}

.luxe-steps--about .luxe-steps__item {
	padding: 44px 34px;
}

.luxe-steps--about .luxe-steps__num {
	font-size: 30px;
}

.luxe-steps--about .luxe-steps__title {
	margin-bottom: 14px;
}

/* ============================================================
 * レスポンシブ
 * ============================================================ */
@media (max-width: 860px) {
	.luxe-about-profile {
		grid-template-columns: 1fr;
		gap: 48px;
		padding: 32px var(--luxe-pad-x) 64px;
	}
	.luxe-about-profile__img,
	.luxe-about-profile__placeholder { height: 420px; }

	.luxe-about-table__row {
		grid-template-columns: 96px 1fr;
		gap: 16px;
	}

	.luxe-about-values { padding: 64px var(--luxe-pad-x); }
	.luxe-about-values__head { margin-bottom: 36px; }
	.luxe-about-values__title { font-size: 30px; }
}