/* CLW 頁尾連結欄 — 由 CLW_Homepage_v3_Bilingual0616 設計稿的 footer-cols 段移植
 *
 * 這個區塊是「加進 Blocksy 頁尾」而不是取代它，所以有兩個刻意的克制：
 *
 *  1. **不設背景色。** 設計稿的頁尾底是暖米色 #f1ece1，但那是整個頁尾。這裡只是
 *     Blocksy 頁尾裡的一個 widget，自己上色會跟下面的版權列變成兩截。實查 Blocksy
 *     的 bottom-row 是 background-color:transparent，整個頁尾吃頁面底色——要改底色
 *     請到 Blocksy customizer 改整個頁尾，那才是這個站的正確做法。
 *
 *  2. **文字顏色繼承。** 用 currentColor ＋ 透明度做出設計稿的層次，而不是寫死
 *     #1a1a1a / #4a4a4a。這樣頁尾底色日後改成深色時，這個區塊會跟著翻轉，
 *     不會變成深底上的深字。只有 hover 的紅是固定的（品牌色）。
 */

.clw-fcols{
	--clw-red:#c8102e;
	--mono:'JetBrains Mono','Courier New',monospace;
	--sans-cn:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;

	display:grid;
	grid-template-columns:1fr 1fr 1fr 1.4fr;
	gap:48px;
	width:100%;
	text-align:left;
}

/* margin reset（site-builder 鐵則）：Blocksy 與 WP core 會對 h4 / ul / li / address
   inject 預設 margin，且主題的 .widget h4 之類選擇器 specificity 蓋得過單一 class。 */
.clw-fcols.clw-fcols :is(h4,ul,ol,li,address,p){margin:0;padding:0;}
.clw-fcols.clw-fcols ul{list-style:none;}
.clw-fcols *{box-sizing:border-box;}

.clw-fcol h4{
	font-size:11px;
	letter-spacing:.22em;
	text-transform:uppercase;
	font-weight:700;
	font-family:var(--mono);
	color:currentColor;
	margin-bottom:18px !important;
	opacity:1;
}
.clw-fcol li{margin-bottom:10px !important;}
.clw-fcol a{
	color:currentColor;
	opacity:.78;
	text-decoration:none;
	font-size:13.5px;
	line-height:1.6;
	transition:color .2s,opacity .2s;
}
.clw-fcol a:hover,
.clw-fcol a:focus-visible{color:var(--clw-red);opacity:1;}
.clw-fcols a:focus-visible{outline:2px solid var(--clw-red);outline-offset:3px;}

.clw-fcol-contact address{
	font-style:normal;
	font-size:13.5px;
	line-height:1.9;
	opacity:.78;
}
.clw-fcol-contact address strong{
	display:block;
	opacity:1;
	font-weight:600;
	margin-bottom:9px !important;
	letter-spacing:.01em;
}
.clw-fcol-contact address a{opacity:1;display:inline-block;}
.clw-fcol-contact .clw-fphone{font-family:var(--mono);letter-spacing:.02em;font-size:13px;}

/* ---- 中文版排版微調 ----
   設計稿掛在 html[data-lang="zh"]，這裡改掛 TranslatePress 實際加的 body class。 */
body.translatepress-zh_CN .clw-fcols{font-family:var(--sans-cn);}
body.translatepress-zh_CN .clw-fcol h4{
	text-transform:none;
	font-family:var(--sans-cn);
	letter-spacing:.16em;
	font-size:13px;
}
body.translatepress-zh_CN .clw-fcol-contact address{font-family:var(--sans-cn);}

@media (max-width:1024px){
	.clw-fcols{grid-template-columns:1fr 1fr;gap:36px 40px;}
}
@media (max-width:640px){
	.clw-fcols{grid-template-columns:1fr;gap:30px;}
}
@media (prefers-reduced-motion:reduce){
	.clw-fcols *{transition:none !important;}
}
