/* ===== 首頁 3D Scroll（滾動驅動影片） ===== */
.sc-story{position:relative;background:#1F1B17;color:#F7F4EF;height:840vh;margin-top:-68px}
.sc-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;perspective:1200px;perspective-origin:50% 50%}
.sc-media{position:absolute;inset:-6%;transform-style:preserve-3d;will-change:transform;transform:translateZ(0) scale(1.08)}
.sc-media video,.sc-media img{width:100%;height:100%;object-fit:cover;display:block}
.sc-media img{transform-origin:50% 50%}
.sc-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,27,23,.35) 0%,rgba(31,27,23,0) 35%,rgba(31,27,23,.15) 70%,rgba(31,27,23,.75) 100%);pointer-events:none}
.sc-grain{position:absolute;inset:0;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}

.sc-copy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 clamp(28px,8vw,120px);transform-style:preserve-3d;will-change:transform,opacity;pointer-events:none}
.sc-copy[data-i]:not([data-i="0"]){opacity:0}
.sc-copy>*{pointer-events:auto}
.sc-copy .sc-kicker{margin:0 0 14px;font-size:12px;letter-spacing:6px;color:#C8A87C;transform:translateZ(60px)}
.sc-copy h1,.sc-copy h2{font-family:'Noto Serif TC',serif;font-weight:600;letter-spacing:4px;margin:0 0 18px;line-height:1.25;font-size:clamp(30px,5vw,64px);text-shadow:0 8px 40px rgba(0,0,0,.35);transform:translateZ(90px)}
.sc-copy p{margin:0 0 30px;max-width:540px;font-size:clamp(14px,1.3vw,18px);line-height:1.9;color:rgba(247,244,239,.85);letter-spacing:1px;transform:translateZ(40px)}
.sc-copy .sc-btns{display:flex;gap:12px;flex-wrap:wrap;transform:translateZ(70px)}
.sc-copy .btn-ghost{color:#F7F4EF;border-color:rgba(247,244,239,.6)}
.sc-copy .btn-ghost:hover{background:rgba(247,244,239,.12)}
.sc-num{position:absolute;right:clamp(28px,6vw,90px);bottom:44px;font-family:'Noto Serif TC',serif;font-size:13px;letter-spacing:4px;color:rgba(247,244,239,.6)}
.sc-num b{font-size:26px;color:#C8A87C;font-weight:500;margin-right:6px}
.sc-line{position:absolute;left:clamp(28px,8vw,120px);bottom:44px;width:120px;height:1px;background:rgba(247,244,239,.25)}
.sc-line i{position:absolute;left:0;top:0;height:100%;width:0;background:#C8A87C}

/* 滾動提示 */
.sc-hint{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-size:11px;letter-spacing:4px;color:rgba(247,244,239,.7);transition:opacity .4s}
.sc-hint span{width:1px;height:38px;background:linear-gradient(180deg,#C8A87C,transparent);animation:scHint 1.6s ease-in-out infinite}
@keyframes scHint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* 右側進度點 */
.sc-dots{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:55;display:flex;flex-direction:column;gap:14px;opacity:0;transition:opacity .4s;pointer-events:none}
.sc-dots.on{opacity:1;pointer-events:auto}
.sc-dots a{width:8px;height:8px;border-radius:50%;border:1px solid #C8A87C;background:transparent;transition:background .3s,transform .3s;cursor:pointer;display:block}
.sc-dots a.on{background:#C8A87C;transform:scale(1.4)}

/* 故事結束後的「回到淺色」過渡 */
.sc-after{background:linear-gradient(180deg,#1F1B17 0%,#F7F4EF 100%);height:120px}

/* 導覽列在深色故事段時透明化 */
header.site.sc-dark{background:rgba(31,27,23,.35);border-bottom-color:rgba(247,244,239,.12)}
header.site.sc-dark nav.main a,header.site.sc-dark .brand .zh{color:#F7F4EF !important}
header.site.sc-dark .brand .en{color:#C8A87C}
header.site.sc-dark .menu-btn svg{stroke:#F7F4EF}
header.site.sc-dark .mobile-nav{background:#1F1B17}
header.site.sc-dark .mobile-nav a{color:#F7F4EF !important}

@media (max-width:760px){
  .sc-copy{justify-content:flex-end;padding:0 36px 104px 24px}
  .sc-copy h1,.sc-copy h2{letter-spacing:2px;font-size:clamp(28px,8.5vw,36px);margin-bottom:12px}
  .sc-copy p{font-size:14px;line-height:1.75;margin-bottom:20px;padding-right:12px}
  .sc-copy .sc-kicker{font-size:11px;letter-spacing:4px;margin-bottom:10px}
  .sc-copy .btn-lg{padding:11px 20px;font-size:14px}
  .sc-copy .sc-btns{max-width:calc(100% - 72px)}
  .sc-num{top:84px;bottom:auto;right:20px}
  .sc-num b{font-size:22px}
  .sc-line{bottom:28px;left:24px;width:60px}
  .sc-hint{display:none}
  .sc-dots{right:10px;gap:12px}
  .sc-shade{background:linear-gradient(180deg,rgba(31,27,23,.45) 0%,rgba(31,27,23,.05) 30%,rgba(31,27,23,.25) 55%,rgba(31,27,23,.85) 100%)}
}
@media (prefers-reduced-motion:reduce){
  .sc-story{height:100vh !important}
  .sc-media{transform:none !important}
  .sc-copy{transform:none !important}
  .sc-copy[data-i="0"]{opacity:1 !important}
  .sc-copy:not([data-i="0"]){display:none}
}