@charset "UTF-8";

/* 首頁載入期間：鎖定捲動，讓首屏文字在揭幕時才開始播放 */
html.is-home-loading, html.is-home-loading body { overflow: hidden; }
.is-home-loading .page-home > :not(.home-loading) { visibility: hidden; }
.is-home-loading .hero-copy span, .is-home-loading .hero-scroll i { animation-play-state: paused; }

/* LOGO 填充與進度：沿用全站灰底、深藍綠及字級 */
.home-loading {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--color-paper, #d7d9dc);
  color: var(--color-deep, #0c2c34);
  opacity: 1;
  transition: opacity .65s ease;
}
.home-loading[hidden] { display: none; }
.home-loading-content { width: min(180px, 70vw); text-align: center; }
.home-loading-logo { position: relative; width: 100%; }
.home-loading-logo > img { width: 100%; opacity: .14; }
.home-loading-fill { position: absolute; inset: 0; clip-path: inset(100% 0 0); }
.home-loading-fill img { width: 100%; }
.page-home .home-loading-progress {
  margin-top: 36px;
  font: 400 var(--font-base, 16px)/1.5 var(--font-en, sans-serif);
  font-variant-numeric: tabular-nums;
  letter-spacing: .12em;
}
.home-loading-caption { display: block; margin-top: 12px; font-size: var(--font-note, 12px); letter-spacing: .32em; }

/* 完成轉場：深藍綠色塊由下往上滿版，再讓整層淡出 */
.home-loading-wipe {
  position: absolute;
  inset: 0;
  background: var(--color-deep, #0c2c34);
  transform: translateY(100%);
  transition: transform .85s cubic-bezier(.76, 0, .24, 1);
}
.home-loading.is-covering .home-loading-wipe { transform: translateY(0); }
.home-loading.is-leaving { opacity: 0; }

/* 減少動態偏好：保留載入提示，縮短位移與淡出時間 */
@media (prefers-reduced-motion: reduce) {
  .home-loading, .home-loading-wipe { transition-duration: .1s; }
}