/* ==========================================================================
   TEYLL — フッター（l-footer-teyll。Figma 1319:1342・SP l-footer-teyll-sp 1370:1499。footer-teyll.php）
   - 濃い紺 teyll/bg/navy・上の角だけ丸い（PC 48・SP 32）。リンクは白 86%
   - PC：左にロゴ・ひとこと・住所と電話・Instagram、右にサービス／業種別／TEYLL について（列のあいだ 72）。下に運営会社・コーポレート・プライバシーポリシー・©
   - SP：縦に。リンクは 2列・1つ 44 の高さ。電話は電話のアイコン＋番号（H4）
   ========================================================================== */
.l-footer-teyll {
	padding: 96px 0 40px;
	border-radius: var(--radius-teyll-panel) var(--radius-teyll-panel) 0 0;
	background: var(--teyll-bg-navy);
	color: var(--teyll-text-on-dark);
	--focus-color: var(--teyll-text-on-dark);
}

.l-footer-teyll__inner {
	display: flex;
	flex-direction: column;
	gap: 72px;
}

.l-footer-teyll__top {
	display: flex;
	justify-content: space-between;
	gap: 40px;
}

/* ---------- 左：ロゴ・ひとこと・住所と電話・Instagram ---------- */
.l-footer-teyll__brand {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	max-width: 400px;
}

.l-footer-teyll__logo img {
	width: auto;
	height: 40px;
}

.l-footer-teyll__tagline {
	font: var(--text-teyll-h4);
	letter-spacing: var(--ls-teyll);
}

.l-footer-teyll__info {
	font: var(--text-teyll-body-s);
	letter-spacing: var(--ls-teyll);
}

.l-footer-teyll__tel-link {
	color: inherit;
	text-decoration: none;
}

.l-footer-teyll__tel-icon {
	display: none;
}

.l-footer-teyll__hours {
	margin-left: 1em;
}

.l-footer-teyll__sns {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font: var(--text-teyll-en-label);
	letter-spacing: var(--ls-teyll-en-label);
	color: inherit;
	text-decoration: none;
}

.l-footer-teyll__tel-link:hover .l-footer-teyll__tel-number,
.l-footer-teyll__sns:hover span:first-of-type {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- 右：3つの列 ---------- */
.l-footer-teyll__nav {
	display: flex;
	gap: 72px;
}

.l-footer-teyll__nav-col {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.l-footer-teyll__nav-title {
	display: flex;
	align-items: center;
	gap: 8px;
	font: var(--text-teyll-label);
	letter-spacing: var(--ls-teyll-label);
}

.l-footer-teyll__nav-title::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--teyll-footer-dot, var(--teyll-accent-green));
}

.l-footer-teyll__nav-title--purple {
	--teyll-footer-dot: var(--teyll-accent-purple);
}

.l-footer-teyll__nav-title--sky {
	--teyll-footer-dot: var(--teyll-accent-sky);
}

.l-footer-teyll__nav-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.l-footer-teyll__nav-list > li,
.l-footer-teyll__links > li {
	display: flex; /* リンクの行の高さを文字の高さに（li の行の高さ＝本文の 32px にしない） */
}

.l-footer-teyll__nav-link,
.l-footer-teyll__link {
	font: var(--text-teyll-body-s);
	letter-spacing: var(--ls-teyll);
	color: inherit;
	opacity: 0.86;
	text-decoration: none;
	white-space: nowrap;
}

.l-footer-teyll__nav-link:hover,
.l-footer-teyll__link:hover,
.l-footer-teyll__nav-link[aria-current="page"] {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- 下：運営会社・コーポレート・プライバシーポリシー・© ---------- */
.l-footer-teyll__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px 32px;
	flex-wrap: wrap;
	padding-top: 28px;
	border-top: 1px solid rgb(255 255 255 / 18%);
}

.l-footer-teyll__links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 32px;
}

.l-footer-teyll__copyright {
	font: var(--text-teyll-en-label);
	letter-spacing: var(--ls-teyll-en-label);
	opacity: 0.86;
}

.l-footer-teyll__copyright small {
	font-size: inherit;
}

@media (max-width: 1023px) {
	.l-footer-teyll__top {
		flex-direction: column;
	}

	.l-footer-teyll__nav {
		flex-wrap: wrap;
		gap: 32px 56px;
	}
}

/* ---------- SP ---------- */
@media (max-width: 767px) {
	.l-footer-teyll {
		padding: 56px 0 32px;
		border-radius: var(--radius-teyll-card) var(--radius-teyll-card) 0 0;
	}

	.l-footer-teyll__inner {
		gap: 40px;
	}

	.l-footer-teyll__top {
		gap: 40px;
	}

	.l-footer-teyll__brand {
		gap: 16px;
	}

	.l-footer-teyll__logo img {
		height: 28px;
	}

	.l-footer-teyll__tel {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	.l-footer-teyll__tel-link {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		min-height: 44px;
	}

	.l-footer-teyll__tel-icon {
		display: block;
	}

	.l-footer-teyll__tel-pre {
		display: none;
	}

	.l-footer-teyll__tel-number {
		font: var(--text-teyll-h4);
	}

	.l-footer-teyll__hours {
		margin-left: 0;
	}

	.l-footer-teyll__sns {
		min-height: 44px;
	}

	.l-footer-teyll__nav {
		flex-direction: column;
		gap: 24px;
	}

	.l-footer-teyll__nav-col {
		gap: 4px;
	}

	.l-footer-teyll__nav-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0 8px;
	}

	.l-footer-teyll__nav-link {
		display: flex;
		align-items: center;
		min-height: 44px;
		white-space: normal;
	}

	.l-footer-teyll__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		padding-top: 16px;
		border-top-color: rgb(255 255 255 / 24%);
	}

	.l-footer-teyll__links {
		gap: 0 20px;
	}

	.l-footer-teyll__link {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}
}
