@charset "utf-8";
/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 語言選擇頁 index.html（RWD）<<<------------------------------------------------*/
/* 版型：置中直式舞台（9:16），電腦版左右以模糊照片填滿。#015 起寬度同內頁：螢幕寬、最多 700px，電腦版要往下捲， */
/*       右側「選單 Menu」按鈕可直接捲到底部的語言按鈕（css_jump_menu.css）                                        */
/* ----------------------------------------------------------------------------------------------------------------*/

html, body { margin:0; padding:0; height:100%; }
body { background:#2b3a22; font-family:"Microsoft JhengHei", "PingFang TC", "Noto Sans TC", sans-serif; }

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* 電腦版左右兩側背景 */
.lang-backdrop { position:fixed; inset:0; background:#2b3a22 center / cover no-repeat; filter:blur(24px) brightness(.55); transform:scale(1.1); }

/* 舞台：寬 = 螢幕寬、最多 700px，高依 9:16 比例（電腦版 700 × 1244，要往下捲） */
.lang-stage { position:relative; width:min(100vw, 700px); height:calc(min(100vw, 700px) * 16 / 9); margin:0 auto; overflow:hidden; background:#2b3a22; box-shadow:0 0 40px rgba(0,0,0,.5); touch-action:pan-y; }
/* 手機直拿：剛好一個畫面。用 svh（網址列展開時的高度，不隨滑動改變）避免畫面跳動 */
@media (max-width:600px) and (orientation:portrait) {
	.lang-stage { height:100vh; }
	@supports (height:100svh) {
		.lang-stage { height:100svh; }
	}
}

/* 頁首 / 頁尾圖：寬度跟著舞台縮放 */
.lang-header { position:absolute; top:0; left:0; z-index:3; width:100%; margin:0; line-height:0; }
.lang-header img,
.lang-footer img { display:block; width:100%; height:auto; }
.lang-footer { position:absolute; bottom:0; left:0; z-index:3; width:100%; line-height:0; }

/* 背景輪播（淡入淡出） */
.lang-slides { position:absolute; inset:0; margin:0; padding:0; list-style:none; }
.lang-slides li { position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease; }
.lang-slides li.is-active { opacity:1; }
.lang-slides img { display:block; width:100%; height:100%; object-fit:cover; }

/* 語言按鈕熱點：座標換算自原 image map（頁尾圖 1080 × 357） */
.lang-btn { position:absolute; top:5.3%; height:66.4%; width:22%; border-radius:6%; transition:background-color .3s; }
.lang-btn--tw { left:14.7%; }
.lang-btn--jp { left:40.5%; }
.lang-btn--en { left:66.3%; }
.lang-btn:hover { background-color:rgba(255,255,255,.18); }

/* 鍵盤操作焦點 */
.lang-btn:focus-visible { outline:3px solid #fff200; outline-offset:2px; }

@media (prefers-reduced-motion: reduce) {
	.lang-slides li { transition:none; }
}