/* ==========================================================================
   公司標誌（inc/logos.php、parts/logo-wall.php）
   尺寸：高度 = --lh（PHP 依長寬比算出的視覺等面積高度）× --ls（情境縮放）。
   預設單色，hover／focus 顯示原色。深色底用 .logo-wall--dark 或 .co-logo--on-dark。
   ========================================================================== */

.co-logo {
	display: block;
	height: calc(var(--lh, 28) * var(--ls, 1) * 1px);
	width: auto;
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
	filter: grayscale(1) contrast(.95) opacity(.66);
	transition: filter .25s ease;
}
/* 標誌本身是淺色或中間色（鼎新、白宮婚紗、絕好聲創）：單色時壓暗，避免比其他標誌淡 */
.co-logo--ink-light { filter: grayscale(1) brightness(.62) contrast(1.15) opacity(.72); }
.co-logo:hover,
.co-logo--color { filter: none; }
.co-logo--on-dark { filter: grayscale(1) invert(1) brightness(1.12) opacity(.72); }
.co-logo--on-dark.co-logo--ink-light { filter: grayscale(1) brightness(0) invert(1) opacity(.74); }
.co-logo--on-dark:hover { filter: none; }

/* --- 時間軸小標誌 ---------------------------------------------------------- */
.co-logo--tl {
	--ls: .66;
	max-height: 36px;
}
.timeline__item:hover .co-logo--tl,
.timeline__item:focus-within .co-logo--tl { filter: none; }

/* --- 案例頁標頭一排標誌 ---------------------------------------------------- */
.co-logos {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 26px;
}
.co-logo--case {
	--ls: .58;
	max-height: 32px;
}
.co-logos:hover .co-logo--case:not(.co-logo--on-dark) { filter: none; }

/* --- 標誌牆 ---------------------------------------------------------------- */
.logo-wall { --ls: 1; color: var(--ink); }
.logo-wall__title {
	margin: 0 0 14px;
	font: 500 12px/1.4 var(--f-display);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
}
.logo-wall__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 208px), 1fr));
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}
.logo-wall__item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	min-height: 132px;
	padding: 28px 22px 24px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	transition: background-color .25s ease;
}
.logo-wall__cell {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 64px;
	color: inherit;
	text-decoration: none;
}
.logo-wall__cell:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 6px;
	border-radius: 4px;
}
.logo-wall .co-logo { object-position: center; }
.logo-wall__item:hover .co-logo,
.logo-wall__item:focus-within .co-logo,
.logo-wall--color .co-logo { filter: none; }

.logo-wall__name {
	font: 400 12px/1.4 var(--f-body);
	letter-spacing: .06em;
	color: var(--muted);
	text-align: center;
}

/* 深色底：白色單色，hover 時格子轉淺色並顯示原色 */
.logo-wall--dark { color: var(--on-dark); }
.logo-wall--dark .logo-wall__title,
.logo-wall--dark .logo-wall__name { color: var(--on-dark-muted); }
.logo-wall--dark .logo-wall__list { border-color: var(--dark-line); }
.logo-wall--dark .logo-wall__item { border-color: var(--dark-line); }
.logo-wall--dark .co-logo { filter: grayscale(1) invert(1) brightness(1.12) opacity(.72); }
.logo-wall--dark .co-logo--ink-light { filter: grayscale(1) brightness(0) invert(1) opacity(.74); }
.logo-wall--dark .logo-wall__item:hover,
.logo-wall--dark .logo-wall__item:focus-within { background-color: var(--bg); }
.logo-wall--dark .logo-wall__item:hover .co-logo,
.logo-wall--dark .logo-wall__item:focus-within .co-logo { filter: none; }
.logo-wall--dark .logo-wall__item:hover .logo-wall__name,
.logo-wall--dark .logo-wall__item:focus-within .logo-wall__name { color: var(--muted); }

@media (max-width: 560px) {
	.logo-wall { --ls: .72; }
	.logo-wall__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.logo-wall__item { min-height: 104px; padding: 22px 12px 18px; gap: 10px; }
	.logo-wall__cell { min-height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
	.co-logo,
	.logo-wall__item { transition: none; }
}