/* ============================================
   聖芯官網首頁 動畫樣式表 (anim.css)
   配合 index.html 使用，所有變數沿用 :root
   ============================================ */

/* === REDUCED MOTION 全域降級 === */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* === B1 PAGE LOAD 進場序列（僅首次進站） === */
body.preload{overflow:hidden;}
.load-curtain{
  position:fixed;inset:0;background:var(--dark);z-index:9999;
  display:flex;align-items:center;justify-content:center;
  transform:translateY(0);transition:transform 1.1s cubic-bezier(.7,0,.3,1);
  pointer-events:auto;
}
.load-curtain.gone{transform:translateY(-100%);pointer-events:none;}
.load-curtain-text{
  font-family:'Noto Serif TC',serif;font-size:22px;color:var(--copper);
  letter-spacing:.3em;animation:loadPulse 1.4s ease-in-out infinite;
}
@keyframes loadPulse{0%,100%{opacity:.35;}50%{opacity:1;}}
@media(max-width:520px){.load-curtain-text{font-size:18px;letter-spacing:.22em;}}

/* === B4 頂部捲動進度條 === */
.scroll-progress{
  position:fixed;top:0;left:0;right:0;height:2px;
  background:transparent;z-index:101;pointer-events:none;
}
.scroll-progress-fill{
  height:100%;width:0;background:var(--copper);
  transition:width .08s linear;
}

/* === B2 NAV 滾動增強（與既有 #nav.scrolled 相容） === */
#nav{transition:box-shadow .3s, height .3s, background .3s, transform .35s;}
#nav.shrink{height:48px;}
#nav.hide{transform:translateY(-100%);}

/* === B3 滑鼠光點 cursor（只在 #hero 內啟用） === */
#hero{position:relative;}
.cursor-dot,.cursor-ring{
  position:fixed;pointer-events:none;z-index:50;
  transform:translate3d(-100px,-100px,0);
  opacity:0;transition:opacity .25s;
  will-change:transform;
}
.cursor-dot{width:6px;height:6px;border-radius:50%;background:var(--copper);}
.cursor-ring{width:32px;height:32px;border:1px solid rgba(200,146,74,.55);border-radius:50%;}
body.cursor-active .cursor-dot,
body.cursor-active .cursor-ring{opacity:1;}
@media(max-width:900px),(hover:none){
  .cursor-dot,.cursor-ring{display:none;}
}

/* === Reveal-on-scroll 通用機制 === */
[data-reveal]{opacity:0;transform:translateY(28px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);
}
[data-reveal="fade"]{transform:none;}
[data-reveal="up-sm"]{transform:translateY(16px);}
[data-reveal="up-lg"]{transform:translateY(40px);}
[data-reveal="left"]{transform:translateX(-28px);}
[data-reveal="right"]{transform:translateX(28px);}
[data-reveal="scale"]{transform:scale(.94);transform-origin:center bottom;}
[data-reveal="clip-up"]{clip-path:inset(100% 0 0 0);opacity:1;transform:none;transition:clip-path 1s cubic-bezier(.7,0,.3,1);}
[data-reveal].is-revealed{opacity:1;transform:none;}
[data-reveal="clip-up"].is-revealed{clip-path:inset(0 0 0 0);}

/* Stagger children */
[data-reveal-stagger] > *,
[data-reveal-stagger-auto] > *{opacity:0;transform:translateY(24px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);
}
[data-reveal-stagger].is-revealed > *,
[data-reveal-stagger-auto].is-revealed > *{opacity:1;transform:none;}
[data-reveal-stagger].is-revealed > *:nth-child(1),
[data-reveal-stagger-auto].is-revealed > *:nth-child(1){transition-delay:0s;}
[data-reveal-stagger].is-revealed > *:nth-child(2),
[data-reveal-stagger-auto].is-revealed > *:nth-child(2){transition-delay:.08s;}
[data-reveal-stagger].is-revealed > *:nth-child(3),
[data-reveal-stagger-auto].is-revealed > *:nth-child(3){transition-delay:.16s;}
[data-reveal-stagger].is-revealed > *:nth-child(4),
[data-reveal-stagger-auto].is-revealed > *:nth-child(4){transition-delay:.24s;}
[data-reveal-stagger].is-revealed > *:nth-child(5),
[data-reveal-stagger-auto].is-revealed > *:nth-child(5){transition-delay:.32s;}
[data-reveal-stagger].is-revealed > *:nth-child(6),
[data-reveal-stagger-auto].is-revealed > *:nth-child(6){transition-delay:.4s;}
[data-reveal-stagger-auto].is-revealed > *:nth-child(7){transition-delay:.48s;}
[data-reveal-stagger-auto].is-revealed > *:nth-child(8){transition-delay:.56s;}

/* 通用 section auto reveal */
[data-reveal-auto]{
  opacity:0;transform:translateY(24px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);
}
[data-reveal-auto].is-revealed{opacity:1;transform:none;}
@media(max-width:520px){
  [data-reveal-auto]{transform:translateY(12px);}
  [data-reveal-auto].is-revealed{transition-duration:.6s;}
}

/* === 01 HERO === */
/* Ken Burns + parallax on slides */
.hero-slide img{
  transform:scale(1.04) translate(0,0);
  transition:transform 8s cubic-bezier(.25,.1,.25,1);
  will-change:transform;
}
.hero-slide.active img{
  transform:scale(1.12) translate(-1.5%,-.8%);
}
/* Mask reveal for H1 lines */
.hero-h1 .line{
  display:block;overflow:hidden;line-height:1.35;
}
.hero-h1 .line > span{
  display:block;transform:translateY(110%);
  transition:transform 1s cubic-bezier(.2,.7,.2,1);
}
body.hero-in .hero-h1 .line:nth-child(1) > span{transform:translateY(0);transition-delay:.05s;}
body.hero-in .hero-h1 .line:nth-child(2) > span{transform:translateY(0);transition-delay:.2s;}

/* Hero stagger sequence */
.hero-tagline,.hero-sub,.hero-divider,.hero-btns{
  opacity:0;transform:translateY(14px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
}
body.hero-in .hero-tagline{opacity:1;transform:none;transition-delay:0s;}
body.hero-in .hero-sub{opacity:1;transform:none;transition-delay:.5s;}
body.hero-in .hero-divider{opacity:1;transform:none;transition-delay:.55s;}
body.hero-in .hero-btns{opacity:1;transform:none;transition-delay:.65s;}

.hero-tagline::before{transition:width .8s ease;}
body.hero-in .hero-tagline::before{transition-delay:.25s;}

/* Hero scroll hint */
.hero-scroll-hint{
  position:absolute;bottom:24px;left:50%;transform:translateX(-50%);
  color:rgba(255,255,255,.5);font-size:10px;letter-spacing:.22em;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  z-index:3;opacity:0;transition:opacity .8s 1.2s;
  pointer-events:none;
}
body.hero-in .hero-scroll-hint{opacity:1;}
.hero-scroll-hint::after{
  content:'';width:1px;height:22px;background:rgba(255,255,255,.5);
  animation:scrollHint 1.8s ease-in-out infinite;transform-origin:top;
}
@keyframes scrollHint{0%,100%{transform:scaleY(.25);}50%{transform:scaleY(1);}}
@media(max-width:768px){.hero-scroll-hint{display:none;}}

/* === 02 TRUST STRIP 徽章中央外展 === */
.trust-strip-inner .trust-chip{
  opacity:0;transform:translateY(10px) scale(.94);
  transition:opacity .55s ease, transform .6s cubic-bezier(.2,.8,.2,1.05), border-color .25s, box-shadow .25s;
}
.trust-strip.is-revealed .trust-chip{opacity:1;transform:none;}
.trust-chip:hover{transform:translateY(-2px)!important;}

/* === 03 ABOUT === */
/* sec-en mask reveal */
.sec-en, .sec-cn{display:inline-block;}
.about-stats .stat{
  opacity:0;transform:translateY(20px);
  transition:opacity .7s, transform .8s cubic-bezier(.2,.7,.2,1);
}
#about.is-revealed .about-stats .stat{opacity:1;transform:none;}
#about.is-revealed .about-stats .stat:nth-child(1){transition-delay:.4s;}
#about.is-revealed .about-stats .stat:nth-child(2){transition-delay:.5s;}
#about.is-revealed .about-stats .stat:nth-child(3){transition-delay:.6s;}
#about.is-revealed .about-stats .stat:nth-child(4){transition-delay:.7s;}

.about-body{
  opacity:0;transform:translateY(14px);
  transition:opacity .8s .3s, transform .8s .3s;
}
#about.is-revealed .about-body{opacity:1;transform:none;}

/* About img clip slices */
.about-img{position:relative;overflow:hidden;}
.about-img-slices{position:absolute;inset:0;display:flex;pointer-events:none;z-index:3;}
.about-img-slices .slc{flex:1;background:var(--blue-mid);transform-origin:top;
  transform:scaleY(1);transition:transform 1s cubic-bezier(.7,0,.3,1);}
#about.is-revealed .about-img-slices .slc{transform:scaleY(0);}
#about.is-revealed .about-img-slices .slc:nth-child(1){transition-delay:.1s;}
#about.is-revealed .about-img-slices .slc:nth-child(2){transition-delay:.2s;}
#about.is-revealed .about-img-slices .slc:nth-child(3){transition-delay:.3s;}
#about.is-revealed .about-img-slices .slc:nth-child(4){transition-delay:.4s;}
#about.is-revealed .about-img-slices .slc:nth-child(5){transition-delay:.5s;}

/* === 04 SERVICE 卡片 stagger + tilt + 圖示動畫 === */
.svc-card{
  opacity:0;transform:translateY(28px);
  transition:opacity .7s, transform .8s cubic-bezier(.2,.7,.2,1), box-shadow .25s;
  transform-style:preserve-3d;
}
#service.is-revealed .svc-card{opacity:1;transform:translateY(0);}
#service.is-revealed .svc-card:nth-child(2){transition-delay:.12s;}
#service.is-revealed .svc-card:nth-child(3){transition-delay:.24s;}

.svc-card-img img{transition:transform .8s cubic-bezier(.2,.8,.2,1);}
.svc-card:hover .svc-card-img img{transform:scale(1.06);}

/* === 05 AFTERSERVICE 圖示繪製 === */
.as-card{
  opacity:0;transform:translateY(20px);
  transition:opacity .7s, transform .7s cubic-bezier(.2,.7,.2,1), border-color .25s, box-shadow .25s;
}
#afterservice.is-revealed .as-card{opacity:1;transform:translateY(0);}
#afterservice.is-revealed .as-card:nth-child(2){transition-delay:.12s;}
#afterservice.is-revealed .as-card:nth-child(3){transition-delay:.24s;}

.as-icon svg path,.as-icon svg circle,.as-icon svg rect,.as-icon svg polyline,.as-icon svg polygon{
  stroke-dasharray:80;stroke-dashoffset:80;
  transition:stroke-dashoffset 1.4s cubic-bezier(.5,0,.2,1);
}
#afterservice.is-revealed .as-card .as-icon svg path,
#afterservice.is-revealed .as-card .as-icon svg circle,
#afterservice.is-revealed .as-card .as-icon svg rect,
#afterservice.is-revealed .as-card .as-icon svg polyline,
#afterservice.is-revealed .as-card .as-icon svg polygon{
  stroke-dashoffset:0;
}
#afterservice.is-revealed .as-card:nth-child(1) .as-icon svg *{transition-delay:.5s;}
#afterservice.is-revealed .as-card:nth-child(2) .as-icon svg *{transition-delay:.65s;}
#afterservice.is-revealed .as-card:nth-child(3) .as-icon svg *{transition-delay:.8s;}

/* === 06 WHY US count-up + 圖示旋轉 === */
.why-card{
  opacity:0;transform:translateY(28px);
  transition:opacity .7s, transform .8s cubic-bezier(.2,.7,.2,1), border-color .25s;
}
#why-us.is-revealed .why-card{opacity:1;transform:none;}
#why-us.is-revealed .why-card:nth-child(2){transition-delay:.1s;}
#why-us.is-revealed .why-card:nth-child(3){transition-delay:.2s;}
#why-us.is-revealed .why-card:nth-child(4){transition-delay:.3s;}

.why-icon{
  transform:rotate(-35deg) scale(.6);opacity:0;
  transition:transform .8s cubic-bezier(.2,.7,.2,1.4), opacity .6s;
}
#why-us.is-revealed .why-icon{transform:rotate(0) scale(1);opacity:1;}
#why-us.is-revealed .why-card:nth-child(1) .why-icon{transition-delay:.2s;}
#why-us.is-revealed .why-card:nth-child(2) .why-icon{transition-delay:.3s;}
#why-us.is-revealed .why-card:nth-child(3) .why-icon{transition-delay:.4s;}
#why-us.is-revealed .why-card:nth-child(4) .why-icon{transition-delay:.5s;}

.why-num{font-variant-numeric:tabular-nums;}

/* === 07 CASES 磁磚 stagger + hover === */
.case-card{
  opacity:0;transform:translateY(24px) scale(.97);
  transition:opacity .7s, transform .75s cubic-bezier(.2,.8,.2,1);
}
#cases.is-revealed .case-card{opacity:1;transform:translateY(0) scale(1);}
#cases.is-revealed .case-card:nth-child(2){transition-delay:.1s;}
#cases.is-revealed .case-card:nth-child(3){transition-delay:.2s;}
#cases.is-revealed .case-card:nth-child(4){transition-delay:.3s;}

.case-img img{transition:transform .85s cubic-bezier(.2,.8,.2,1);}
.case-card:hover .case-img img{transform:scale(1.08);}

/* === 08 WORKFLOW 線條繪製 + 節點 stagger === */
.workflow-steps::before{
  /* 加粗到 2px + 漸層底色保留 */
  height:2px!important;
  background:var(--blue-light);
  overflow:hidden;
}
.workflow-steps::after{
  content:'';position:absolute;top:36px;left:10%;height:2px;
  width:0;background:linear-gradient(to right, var(--copper) 0%, var(--copper-light) 50%, var(--copper) 100%);
  transition:width 2.2s cubic-bezier(.5,0,.2,1);z-index:1;
  box-shadow:0 0 6px rgba(200,146,74,.4);
}
#workflow.is-revealed .workflow-steps::after{width:80%;}

.workflow-flow-dot{
  position:absolute;top:36px;
  width:12px;height:12px;border-radius:50%;
  background:var(--copper);transform:translate(-50%,-50%);
  box-shadow:0 0 0 6px rgba(200,146,74,.25), 0 0 12px rgba(200,146,74,.6);
  z-index:2;pointer-events:none;
  opacity:0;left:10%;
}
#workflow.is-revealed .workflow-flow-dot{
  animation: flowDotRun 2.6s cubic-bezier(.5,0,.2,1) forwards;
}
@keyframes flowDotRun{
  0%{left:10%;opacity:0;}
  10%{opacity:1;}
  85%{opacity:1;}
  100%{left:90%;opacity:0;}
}

.workflow-step .step-circle{
  opacity:0;transform:scale(.5);
  transition:opacity .55s, transform .6s cubic-bezier(.2,.7,.2,1.5), border-color .25s, background .25s;
}
#workflow.is-revealed .workflow-step .step-circle{opacity:1;transform:scale(1);}
#workflow.is-revealed .workflow-step:nth-child(1) .step-circle{transition-delay:.3s;}
#workflow.is-revealed .workflow-step:nth-child(2) .step-circle{transition-delay:.6s;}
#workflow.is-revealed .workflow-step:nth-child(3) .step-circle{transition-delay:.9s;}
#workflow.is-revealed .workflow-step:nth-child(4) .step-circle{transition-delay:1.2s;}
#workflow.is-revealed .workflow-step:nth-child(5) .step-circle{transition-delay:1.5s;}
#workflow.is-revealed .workflow-step:nth-child(6) .step-circle{transition-delay:1.8s;}

.workflow-step .step-title,.workflow-step .step-desc{
  opacity:0;transform:translateY(6px);
  transition:opacity .5s, transform .5s;
}
#workflow.is-revealed .workflow-step .step-title,
#workflow.is-revealed .workflow-step .step-desc{opacity:1;transform:none;}
#workflow.is-revealed .workflow-step:nth-child(1) .step-title{transition-delay:.45s;}
#workflow.is-revealed .workflow-step:nth-child(1) .step-desc{transition-delay:.55s;}
#workflow.is-revealed .workflow-step:nth-child(2) .step-title{transition-delay:.75s;}
#workflow.is-revealed .workflow-step:nth-child(2) .step-desc{transition-delay:.85s;}
#workflow.is-revealed .workflow-step:nth-child(3) .step-title{transition-delay:1.05s;}
#workflow.is-revealed .workflow-step:nth-child(3) .step-desc{transition-delay:1.15s;}
#workflow.is-revealed .workflow-step:nth-child(4) .step-title{transition-delay:1.35s;}
#workflow.is-revealed .workflow-step:nth-child(4) .step-desc{transition-delay:1.45s;}
#workflow.is-revealed .workflow-step:nth-child(5) .step-title{transition-delay:1.65s;}
#workflow.is-revealed .workflow-step:nth-child(5) .step-desc{transition-delay:1.75s;}
#workflow.is-revealed .workflow-step:nth-child(6) .step-title{transition-delay:1.95s;}
#workflow.is-revealed .workflow-step:nth-child(6) .step-desc{transition-delay:2.05s;}

@media(max-width:1024px){
  .workflow-flow-dot{display:none;}
  .workflow-steps::after{display:none;}
  .workflow-steps::before{height:1px!important;background:var(--blue-light);}
}

/* === 09 TRUST 3 區 clip-path 揭示 === */
.bni-card,.member-card,.cert-card{
  clip-path:inset(100% 0 0 0);opacity:0;
  transition:clip-path 1s cubic-bezier(.7,0,.3,1), opacity .6s,
             border-color .25s, box-shadow .25s, transform .25s;
}
#trust .bni-row.is-revealed .bni-card,
#trust .member-row.is-revealed .member-card,
#trust .cert-row.is-revealed .cert-card{clip-path:inset(0 0 0 0);opacity:1;}
.bni-row.is-revealed .bni-card:nth-child(2){transition-delay:.15s;}
.member-row.is-revealed .member-card:nth-child(2){transition-delay:.15s;}
.cert-row.is-revealed .cert-card:nth-child(2){transition-delay:.12s;}
.cert-row.is-revealed .cert-card:nth-child(3){transition-delay:.24s;}

.trust-block-title{
  opacity:0;transform:translateY(10px);
  transition:opacity .6s, transform .6s;
}
.trust-three .is-revealed .trust-block-title{opacity:1;transform:none;}
#trust .trust-three > div .trust-block-title{opacity:0;transform:translateY(10px);}
#trust .trust-three > div.is-revealed .trust-block-title{opacity:1;transform:none;}

/* === 10 TESTIMONIALS 揭示 + 微浮動 === */
.testi-grid .testi-placeholder,.testi-grid .testi-card{
  opacity:0;transform:translateY(20px);
  transition:opacity .7s, transform .8s cubic-bezier(.2,.7,.2,1);
}
#testimonials.is-revealed .testi-placeholder,
#testimonials.is-revealed .testi-card{
  opacity:1;transform:none;
  animation:gentleFloat 5s ease-in-out infinite;
}
#testimonials.is-revealed .testi-grid > *:nth-child(1){transition-delay:0s;animation-delay:0s;}
#testimonials.is-revealed .testi-grid > *:nth-child(2){transition-delay:.12s;animation-delay:1.6s;}
#testimonials.is-revealed .testi-grid > *:nth-child(3){transition-delay:.24s;animation-delay:3.2s;}

@keyframes gentleFloat{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-4px);}
}

/* === 11 NEWS 卡片 stagger + 標題下劃線 === */
.news-card{
  opacity:0;transform:translateY(24px);
  transition:opacity .7s, transform .8s cubic-bezier(.2,.7,.2,1), box-shadow .25s;
}
#news.is-revealed .news-card,
[data-reveal-stagger].is-revealed > .news-card,
[data-reveal-stagger-auto].is-revealed > .news-card{opacity:1;transform:translateY(0);}
#news.is-revealed .news-card:nth-child(2){transition-delay:.1s;}
#news.is-revealed .news-card:nth-child(3){transition-delay:.2s;}
#news.is-revealed .news-card:nth-child(4){transition-delay:.3s;}
#news.is-revealed .news-card:nth-child(5){transition-delay:.35s;}
#news.is-revealed .news-card:nth-child(6){transition-delay:.4s;}

.news-card-title{
  display:inline;
  background-image:linear-gradient(var(--copper),var(--copper));
  background-size:0% 1px;background-position:left 100%;background-repeat:no-repeat;
  transition:background-size .5s cubic-bezier(.5,0,.2,1);
  padding-bottom:2px;
}
.news-card:hover .news-card-title{background-size:100% 1px;}

/* === 12 CTA BANNER 漸層流動 + 按鈕呼吸 === */
.cta-card-bg{
  background:linear-gradient(120deg,#6A8AA8 0%,#4A6E92 35%,#3A5870 70%,#5C7E9F 100%);
  background-size:200% 100%;
  animation:ctaShift 9s ease-in-out infinite;
}
@keyframes ctaShift{
  0%,100%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
}
.btn-cta-white{
  animation:ctaPulse 2.6s ease-in-out infinite;
}
@keyframes ctaPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.5);}
  70%{box-shadow:0 0 0 14px rgba(255,255,255,0);}
}
@media(prefers-reduced-motion: reduce){
  .btn-cta-white{animation:none;}
}

/* === 13 BRAND chip 灰階→彩色 hover === */
.brand-chip{
  filter:grayscale(.7);
  transition:background .3s, color .3s, filter .35s, transform .25s, border-color .25s;
}
.brand-chip:hover{
  filter:grayscale(0);
  background:#fff;color:var(--text);
  border-color:var(--copper);
  transform:translateY(-3px);
  box-shadow:0 6px 18px rgba(200,146,74,.15);
}

/* === 14 AREA 4 卡片 clip-path + pulse 脈動光環 === */
.area-card{
  position:relative;overflow:hidden;
  clip-path:inset(100% 0 0 0);opacity:0;
  transition:clip-path .9s cubic-bezier(.7,0,.3,1), opacity .55s,
             border-color .25s, transform .25s;
}
#area.is-revealed .area-card{clip-path:inset(0 0 0 0);opacity:1;}
#area.is-revealed .area-card:nth-child(1){transition-delay:0s;}
#area.is-revealed .area-card:nth-child(2){transition-delay:.12s;}
#area.is-revealed .area-card:nth-child(3){transition-delay:.24s;}
#area.is-revealed .area-card:nth-child(4){transition-delay:.36s;}

/* 服務據點脈動光環：右上角小光點 */
.area-card::after{
  content:'';position:absolute;top:18px;right:18px;
  width:8px;height:8px;border-radius:50%;
  background:var(--copper);opacity:0;
  transition:opacity .6s 1s;
  z-index:2;
}
#area.is-revealed .area-card::after{opacity:1;}
.area-card .area-pulse{
  position:absolute;top:18px;right:18px;
  width:8px;height:8px;border-radius:50%;
  pointer-events:none;z-index:1;
}
.area-card .area-pulse::before,
.area-card .area-pulse::after{
  content:'';position:absolute;inset:0;border-radius:50%;
  background:var(--copper);opacity:0;
}
#area.is-revealed .area-card .area-pulse::before{
  animation:areaPulse 2.6s ease-out infinite 1.2s;
}
#area.is-revealed .area-card .area-pulse::after{
  animation:areaPulse 2.6s ease-out infinite 2.5s;
}
@keyframes areaPulse{
  0%{transform:scale(1);opacity:.5;}
  100%{transform:scale(5);opacity:0;}
}
#area.is-revealed .area-card:nth-child(2) .area-pulse::before{animation-delay:1.5s;}
#area.is-revealed .area-card:nth-child(3) .area-pulse::before{animation-delay:1.8s;}
#area.is-revealed .area-card:nth-child(4) .area-pulse::before{animation-delay:2.1s;}

/* === 15 LOCATION 地圖 clip-path 揭示 + info fade === */
.loc-map{
  clip-path:inset(0 100% 0 0);
  transition:clip-path 1.2s cubic-bezier(.7,0,.3,1);
}
#location.is-revealed .loc-map{clip-path:inset(0 0 0 0);}

.loc-info{
  opacity:0;transform:translateY(20px);
  transition:opacity .8s .4s, transform .8s .4s;
}
#location.is-revealed .loc-info{opacity:1;transform:none;}

.loc-line{
  opacity:0;transform:translateY(8px);
  transition:opacity .5s, transform .5s;
}
#location.is-revealed .loc-line{opacity:1;transform:none;}
#location.is-revealed .loc-line:nth-of-type(1){transition-delay:.7s;}
#location.is-revealed .loc-line:nth-of-type(2){transition-delay:.8s;}
#location.is-revealed .loc-line:nth-of-type(3){transition-delay:.9s;}

/* === BT 按鈕系統升級 === */
/* 主 hero / 主 CTA 按鈕加磁吸效果（JS 控制 transform） */
.btn-hero-main,.btn-cta-white{will-change:transform;}

/* 漸層流光 - 套用在 hero main btn 與 nav-cta */
.btn-hero-main{
  background:linear-gradient(120deg,var(--copper) 0%,var(--copper-light) 50%,var(--copper) 100%);
  background-size:200% 100%;background-position:0% 0%;
  transition:background-position .5s cubic-bezier(.5,0,.2,1), transform .15s;
}
.btn-hero-main:hover{
  background-position:100% 0%;
  transform:translateY(-2px);
}

/* Ghost 按鈕邊框繞光 */
.btn-hero-ghost,.btn-cta-ghost{
  position:relative;overflow:hidden;z-index:1;
}
.btn-hero-ghost::before,.btn-cta-ghost::before{
  content:'';position:absolute;inset:0;
  background:rgba(255,255,255,.22);
  transform:scaleX(0);transform-origin:left;
  transition:transform .45s cubic-bezier(.5,0,.2,1);
  z-index:-1;
}
.btn-hero-ghost:hover::before,.btn-cta-ghost:hover::before{transform:scaleX(1);}

/* 第 3 款 - all-btn 邊框 swipe（淺色背景區） */
.all-btn{position:relative;overflow:hidden;z-index:1;}
.all-btn::before{
  content:'';position:absolute;inset:0;
  background:var(--copper);
  transform:scaleX(0);transform-origin:left;
  transition:transform .4s cubic-bezier(.5,0,.2,1);
  z-index:-1;
}
.all-btn:hover{background:var(--text);}
.all-btn:hover::before{transform:scaleX(1);}

/* pill-btn hover 細節 */
.pill-btn:hover .pill-arrow{background:var(--copper-light);}
.pill-btn .pill-arrow{transition:background .25s;}

/* === 手機版整體降級 === */
@media(max-width:900px){
  /* 關閉 tilt（手機無 hover、且性能考量） */
  .svc-card{transform:none!important;}
  .svc-card.is-tilting{transform:none!important;}

  /* 簡化 stagger 延遲，避免長 scroll 時動畫感覺慢 */
  [data-reveal-stagger].is-revealed > *{transition-delay:0s!important;}

  /* workflow flow dot 隱藏 */
  .workflow-flow-dot{display:none;}

  /* 進場距離縮短 */
  [data-reveal]{transform:translateY(16px);}

  /* hero scroll hint 隱藏 */
  .hero-scroll-hint{display:none;}
}

@media(max-width:520px){
  /* 進一步縮短延遲 + 降低位移 */
  [data-reveal]{transform:translateY(12px);}
  [data-reveal].is-revealed{transition-duration:.55s;}
  [data-reveal-stagger].is-revealed > *{transition-duration:.5s;}

  /* area pulse 在手機關掉，避免一直閃 */
  .area-card .area-pulse,
  .area-card::after{display:none;}

  /* about 切片動畫於手機關掉，避免太搶眼 */
  .about-img-slices{display:none;}
}