/* RECRUIT（採用の入口。詳細条件は採用LP側）。TOP・ABOUT・STYLE・MENU・SALON・STAFF・NEWS と共通のトークン／ラベル規則。 */

.lw-rwrap {
	max-width: var(--lw-container);
	margin-inline: auto;
}

/* ---- HERO（左: テキスト / 右: 写真） ---- */
.lw-rhero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	min-height: clamp(460px, 48vw, 660px);
	background: var(--lw-ink-2);
}

.lw-rhero__text {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: clamp(40px, 6vw, 80px) clamp(20px, 4vw, 56px) clamp(40px, 6vw, 80px) max(clamp(20px, 5vw, 64px), calc((100vw - 1180px) / 2));
}

.lw-rhero__eyebrow {
	margin-bottom: 22px;
	font-family: var(--lw-font-en);
	font-size: clamp(18px, 1.45vw, 21px);
	font-weight: 700;
	letter-spacing: 0.26em;
	color: var(--lw-accent-pale);
}

.lw-rhero__title {
	font-size: clamp(36px, 5.3vw, 78px);
	line-height: 0.96;
	white-space: nowrap; /* 「THE STANDARD」を1行に保つ */
	letter-spacing: -0.01em;
}

.lw-rhero__lead {
	margin-top: 26px;
	max-width: 30ch;
	font-size: clamp(16px, 1.7vw, 20px);
	font-weight: 700;
	line-height: 1.7;
}

.lw-rhero__media {
	position: relative;
	background: var(--lw-ink-3);
}

.lw-rhero__media .lw-photo {
	position: absolute;
	inset: 0;
	aspect-ratio: auto;
	height: 100%;
}

.lw-rhero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(90deg, rgba(var(--lw-fade-rgb), 0.7) 0%, rgba(var(--lw-fade-rgb), 0) 30%);
}

/* ---- 02 WHO WE'RE LOOKING FOR ---- */
.lw-rmind {
	padding: clamp(64px, 8vw, 120px) clamp(20px, 5vw, 64px);
	background: var(--lw-ink);
}

.lw-rmind__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
	margin-top: clamp(32px, 4vw, 56px);
}

.lw-rmind__item {
	padding: clamp(28px, 3vw, 40px) 0 clamp(32px, 3.5vw, 48px);
	border-top: 1px solid var(--lw-line-strong);
}

.lw-rmind__no {
	font-family: var(--lw-font-en);
	font-size: clamp(56px, 6vw, 88px);
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.04em;
	color: var(--lw-accent);
}

.lw-rmind__en {
	margin-top: 18px;
	font-family: var(--lw-font-en);
	font-size: clamp(30px, 3.2vw, 44px);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: 0.04em;
}

.lw-rmind__head {
	margin-top: 20px;
	max-width: 22ch;
	font-size: clamp(17px, 1.6vw, 20px);
	font-weight: 700;
	line-height: 1.75;
	text-wrap: pretty;
}

.lw-rmind__text {
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.9;
	color: var(--lw-muted);
}

@media (min-width: 768px) {
	.lw-rmind__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: clamp(20px, 3vw, 48px);
	}
}

/* ---- 03 GROW WITH LOWRL（大きな英字ラベル × 説明の左右組み） ---- */
.lw-rgrow {
	padding: clamp(64px, 8vw, 120px) clamp(20px, 5vw, 64px);
	background: var(--lw-ink-2);
}

.lw-rgrow__list {
	margin-top: clamp(32px, 4vw, 56px);
	border-bottom: 1px solid var(--lw-line);
}

.lw-rgrow__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px 48px;
	align-items: center;
	padding: clamp(28px, 3.5vw, 48px) 0;
	border-top: 1px solid var(--lw-line);
}

.lw-rgrow__en {
	font-family: var(--lw-font-en);
	font-size: clamp(44px, 7vw, 104px);
	font-weight: 700;
	line-height: 0.95;
	letter-spacing: -0.01em;
	overflow-wrap: anywhere;
}

.lw-rgrow__head {
	font-size: clamp(17px, 1.8vw, 22px);
	font-weight: 700;
	line-height: 1.7;
	text-wrap: pretty;
}

.lw-rgrow__text {
	margin-top: 12px;
	max-width: 46ch;
	font-size: 15px;
	line-height: 1.95;
	color: rgba(var(--lw-text-rgb), 0.84);
}

@media (min-width: 1024px) {
	.lw-rgrow__row {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	}
}

/* ---- 04 WE ARE LOWRL.（大2枚＋小3枚） ---- */
.lw-rteam {
	padding: clamp(64px, 8vw, 120px) clamp(20px, 5vw, 64px);
	background: linear-gradient(180deg, #120F0E, #171310);
}

.lw-rteam__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-auto-rows: clamp(160px, 17vw, 250px);
	gap: 8px;
	margin-top: clamp(28px, 3.5vw, 44px);
}

.lw-rteam__tile .lw-photo {
	aspect-ratio: auto;
	height: 100%;
}

.lw-rteam__tile--a { grid-column: 1 / span 7; grid-row: span 2; }
.lw-rteam__tile--b { grid-column: span 5; grid-row: span 2; }
.lw-rteam__tile--c,
.lw-rteam__tile--d,
.lw-rteam__tile--e { grid-column: span 4; }

.lw-rteam__more {
	margin-top: clamp(28px, 3.5vw, 44px);
	text-align: right;
}

/* ---- 05 OUR SALON ---- */
.lw-rsalon {
	padding: clamp(64px, 8vw, 120px) clamp(20px, 5vw, 64px);
	background: var(--lw-ink);
}

.lw-rsalon__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(40px, 5vw, 24px);
	margin-top: clamp(32px, 4vw, 48px);
}

.lw-rsalon__media {
	overflow: hidden;
	background: var(--lw-ink-3);
}

.lw-rsalon__name {
	margin-top: 22px;
	font-size: clamp(32px, 3.8vw, 48px);
	line-height: 1;
}

.lw-rsalon__text {
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.9;
	color: rgba(var(--lw-text-rgb), 0.85);
}

.lw-rsalon__cta {
	margin-top: 18px;
}

@media (min-width: 768px) {
	.lw-rsalon__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(16px, 2vw, 24px);
	}
}

/* ---- 06 MORE ABOUT RECRUIT ---- */
.lw-rdet {
	padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 64px);
	background: var(--lw-ink-2);
}

.lw-rdet__inner {
	display: grid;
	gap: clamp(24px, 4vw, 64px);
	align-items: end;
}

.lw-rdet__text {
	max-width: 46ch;
	font-size: clamp(15px, 1.5vw, 17px);
	line-height: 2;
	color: rgba(var(--lw-text-rgb), 0.88);
}

.lw-rdet__cta {
	margin-top: 28px;
}

@media (min-width: 1024px) {
	.lw-rdet__inner {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

/* ---- 07 READY TO JOIN US? ---- */
.lw-rjoin {
	padding: clamp(72px, 9vw, 140px) clamp(20px, 5vw, 64px);
	background: var(--lw-ink);
}

.lw-rjoin__eyebrow {
	margin-bottom: 18px;
	font-family: var(--lw-font-en);
	font-size: var(--lw-fs-label);
	font-weight: 700;
	letter-spacing: 0.26em;
	color: var(--lw-accent);
}

.lw-rjoin__title {
	font-size: clamp(48px, 9vw, 128px);
	line-height: 0.92;
	letter-spacing: -0.01em;
}

.lw-rjoin__text {
	margin: 28px 0 36px;
	max-width: 40ch;
	font-size: clamp(16px, 1.7vw, 19px);
	font-weight: 700;
	line-height: 1.8;
}

.lw-rjoin__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* ---- Mobile ---- */
@media (max-width: 767px) {
	.lw-rhero {
		display: flex;
		flex-direction: column-reverse;
		min-height: 0;
	}

	.lw-rhero__media {
		height: min(100vw, 420px);
	}

	.lw-rhero__text {
		padding: 36px var(--lw-gutter) 44px;
	}

	.lw-rhero__eyebrow {
		font-size: 17px;
	}

	.lw-rhero__title {
		font-size: min(11.4vw, 58px);
	}

	/* WE ARE LOWRL.：横スクロール（大きい写真が先頭） */
	.lw-rteam__grid {
		display: flex;
		grid-auto-rows: auto;
		margin-inline: calc(var(--lw-gutter) * -1);
		padding-inline: var(--lw-gutter);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: var(--lw-gutter);
		scrollbar-width: none;
		overscroll-behavior-x: contain;
	}

	.lw-rteam__grid::-webkit-scrollbar {
		display: none;
	}

	.lw-rteam__tile {
		flex: 0 0 64%;
		scroll-snap-align: start;
	}

	.lw-rteam__tile--a,
	.lw-rteam__tile--b {
		flex-basis: 84%;
	}

	.lw-rteam__tile .lw-photo {
		aspect-ratio: 4 / 3;
		height: auto;
	}

	.lw-rteam__more .lw-btn,
	.lw-rsalon__cta .lw-btn,
	.lw-rdet__cta .lw-btn,
	.lw-rjoin__cta .lw-btn {
		width: 100%;
	}

	.lw-rjoin__cta {
		flex-direction: column;
	}

	.lw-rsalon__media .lw-photo__img {
		object-fit: cover;
		object-position: var(--lw-focus-sp, center center);
	}
}
