/* Neutral typography and surfaces, inspired by editorial retail layouts. */
:root{--paper:#fff;--ink:#1d1d1f;--muted:#6e6e73;--line:#d2d2d7;--sage:#f5f5f7;--orange:#326858}
body{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","PingFang TC","Noto Sans TC",sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3{letter-spacing:-.025em;font-weight:600}h1 em{color:#6e6e73}.lead{font-weight:400}.eyebrow{color:#6e6e73;letter-spacing:.09em}.wordmark{color:#163f35}
.header{background:#fff}.button{border-radius:28px}.primary{background:#1d1d1f;color:#fff}.coral{background:#1d1d1f;color:#fff;border-color:#1d1d1f}
.blj-about,.story-section,.local-hero,.budget-section,.process-section,.application-timeline,footer{background:#f5f5f7;color:#1d1d1f}
.story-card,.service-price,.budget-result{background:#fff;color:#1d1d1f;border:1px solid #e5e5e7;border-radius:22px;box-shadow:0 8px 28px #00000005}
.story-section p,.story-section .eyebrow,.story-number,.story-controls,.story-controls button,.story-card .eyebrow,.footer-grid small,.footer-grid a,.local-hero p{color:#6e6e73}
.story-controls button{border-color:#d2d2d7}.story-dots button{background:#d2d2d7}.story-dots button[aria-current=true]{background:#1d1d1f}
.note-box,.why-principle,.employer-priority-cards article,.employer-priority-cards .refund-card,tfoot{background:#f5f5f7;color:#1d1d1f}
input,select{background:#fff;color:#1d1d1f;border-color:#d2d2d7}.ticker{background:#f5f5f7;color:#6e6e73}.connection-note span{color:#1d1d1f}
.connection-story{background:#f5f5f7;color:#1d1d1f}#bridge-canvas{background:#f5f5f7}.bridge-gradient{background:linear-gradient(90deg,#f5f5f7 0%,#f5f5f7ed 27%,#f5f5f700 64%)}
.connection-copy h1{text-shadow:none;font-weight:600}.connection-copy h1 em{color:#6e6e73}.connection-copy .eyebrow,.connection-lead,.connection-detail,.bridge-priority,.bridge-caption p,.bridge-caption>span,.bridge-top,.bridge-bottom{color:#515154}
.connection-copy .primary{background:#1d1d1f;color:white;border-color:#1d1d1f}.connection-copy .outline{color:#1d1d1f;border-color:#86868b}.bridge-top button{background:#fff;color:#1d1d1f;border-color:#d2d2d7}.bridge-progress{background:#e5e5e7}.bridge-progress i{background:#86868b}
.endpoint-label,.endpoint-label.hongkong,.endpoint-label.hub-label{background:#ffffffed;border:1px solid #d2d2d7;box-shadow:0 8px 24px #0000000a;border-radius:14px}.endpoint-label strong,.endpoint-label.hongkong strong,.hub-label strong{color:#1d1d1f}.endpoint-label small,.endpoint-label span,.endpoint-label.hongkong small,.hub-label small,.hub-label span{color:#6e6e73}
@media(max-width:1000px){.bridge-gradient{background:linear-gradient(180deg,#f5f5f7 0%,#f5f5f7ed 32%,#f5f5f700 66%)}}
/* Light surfaces need explicit overrides for the former dark-section text. */
.story-grid>div>p:not(.eyebrow),.story-card>p:last-of-type,
.service-price p,.service-price strong small,.budget-result>p:not(.eyebrow),
.local-hero p:not(.lead):not(.eyebrow),.footer-grid>div:nth-child(2)>p{color:#515154}
.story-card .eyebrow,.story-controls span,.footer-grid small,.about-source{color:#59595f}
.story-controls button:hover{background:#1d1d1f;color:#fff}
.about-grid{display:block;position:relative;padding:12px 0 40px;isolation:isolate}
.about-grid article{position:sticky;top:122px;min-height:280px;margin:0 0 48px;padding:44px 48px 44px 130px;background:#fff;border:1px solid #d2d2d7;border-radius:24px;box-shadow:0 14px 40px #1d1d1f0c;overflow:hidden}
.about-grid article:nth-child(2){top:146px;background:#fafafa}
.about-grid article:nth-child(3){top:170px;background:#f0f1f3}
.about-grid article::before{content:'01';position:absolute;left:40px;top:44px;font-size:42px;font-weight:600;line-height:1;color:#63636b;letter-spacing:-.04em}
.about-grid article:nth-child(2)::before{content:'02'}.about-grid article:nth-child(3)::before{content:'03'}
.about-grid article>span{font-size:13px;color:#515154;letter-spacing:.05em}
.about-grid h3{font-size:clamp(24px,2.5vw,36px);color:#1d1d1f;line-height:1.3;margin:20px 0 18px;max-width:780px}
.about-grid p{font-size:17px;line-height:1.8;color:#515154;max-width:780px;margin:0}
@supports(animation-timeline:view()){
@keyframes service-enter{from{opacity:.65;transform:translateY(35px) scale(.97)}to{opacity:1;transform:none}}
.about-grid article{animation:service-enter linear both;animation-timeline:view();animation-range:entry 0% entry 95%}
}
@media(max-width:760px){.about-grid article{top:128px;padding:30px 26px;min-height:310px;margin-bottom:28px;border-radius:20px}.about-grid article:nth-child(2){top:142px}.about-grid article:nth-child(3){top:156px}.about-grid article::before{display:none}.about-grid h3{font-size:26px}.about-grid p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.about-grid article{animation:none;position:relative;top:auto!important}}

/* Let the enlarged scene integrate with the copy without obscuring its contrast. */
.bridge-gradient{background:linear-gradient(90deg,#f5f5f7ed 0%,#f5f5f7c7 26%,#f5f5f700 57%)}
@media(max-width:1000px){.bridge-gradient{background:linear-gradient(180deg,#f5f5f7 0%,#f5f5f7e8 34%,#f5f5f700 65%)}}
/* 下方人流保持清楚，上方文字仍保留柔和襯底。 */
@media(min-width:1001px){.bridge-gradient{mask-image:linear-gradient(to bottom,#000 0%,#000 49%,transparent 75%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 49%,transparent 75%)}}
/* 流程字幕放在左上留白，獨立於 3D 場景層。 */
.connection-sticky .bridge-caption{z-index:8;top:85px;bottom:auto;left:5vw;width:min(420px,38vw);max-width:420px;padding:24px 28px;border-radius:20px;background:rgba(255,255,255,.94);box-shadow:0 10px 40px #17232e0a;backdrop-filter:blur(12px);color:#1d1d1f}
.connection-sticky .bridge-caption h2{color:#1d1d1f;font-size:clamp(25px,2.5vw,38px)}
.connection-sticky .bridge-caption p{color:#515154;font-size:16px}
@media(max-width:1000px){.connection-sticky .bridge-caption{top:70px;left:6vw;width:88vw;max-width:none;padding:18px 22px}.connection-sticky .bridge-caption h2{font-size:28px}}
.connection-sticky .bridge-caption{background:none;box-shadow:none;backdrop-filter:none;border:0;border-radius:0;padding:0;text-shadow:0 1px 10px #f5f5f780}
@media(max-width:1000px){.connection-sticky .bridge-caption{padding:0}}
/* 首屏文案居中，模型與既有人流路徑保留。 */
.connection-sticky .connection-copy{top:8%;left:50%;right:auto;width:min(800px,90vw);max-width:800px;margin-left:calc(min(800px,90vw) / -2);text-align:center}
.connection-sticky .connection-copy h1{font-size:clamp(34px,3.7vw,58px);margin:12px 0;line-height:1.15}
.connection-sticky .connection-copy .eyebrow{margin:0 0 10px}
.connection-sticky .connection-copy .connection-detail{margin:8px auto;max-width:650px}
.connection-sticky .connection-copy .connection-lead{margin:8px 0}
.connection-sticky .connection-copy .actions{justify-content:center;margin-top:12px}
.connection-sticky .connection-copy .bridge-priority{margin-top:10px}
.connection-sticky .bridge-gradient{background:linear-gradient(180deg,#f5f5f7eb, #f5f5f799 28%,transparent 49%);mask-image:none;-webkit-mask-image:none}
@media(max-width:1000px){.connection-sticky .connection-copy{top:60px;width:88vw;margin-left:-44vw}.connection-sticky .connection-copy h1{font-size:34px}.connection-sticky .connection-copy .connection-detail{font-size:12px}}
.bridge-under-copy{position:absolute;z-index:2;left:50%;transform:translateX(-50%);bottom:12%;width:min(760px,90vw);text-align:center;pointer-events:none;color:#515154}
.bridge-under-copy .connection-lead{font-size:20px;font-weight:500;margin:0 0 10px;color:#363b3d}
.bridge-under-copy .connection-detail{font-size:14px;line-height:1.9;margin:0;color:#62686b}
@media(max-width:1000px){.bridge-under-copy{bottom:9%;width:88vw}.bridge-under-copy .connection-lead{font-size:17px}.bridge-under-copy .connection-detail{font-size:12px}}
.connection-copy,.bridge-under-copy{opacity:0;will-change:opacity,transform}
@media(prefers-reduced-motion:reduce){.connection-copy,.bridge-under-copy{opacity:1;will-change:auto}}
/* 只覆蓋畫布：四周柔和淡出，不沖淡標題及導覽文字。 */
#bridge-canvas::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#f5f5f7b8,transparent 15%,transparent 84%,#f5f5f7d9),linear-gradient(180deg,#f5f5f74d,transparent 45%,transparent 89%,#f5f5f766)}
.connection-sticky .bridge-caption{top:auto;bottom:12%;left:50%;width:min(580px,88vw);max-width:580px;text-align:center;transform:translateX(-50%)}
.connection-sticky .bridge-caption h2{font-size:clamp(25px,2.5vw,38px);text-wrap:balance;line-height:1.4}
.connection-sticky .bridge-caption p{line-height:1.8;text-wrap:balance}
/* 服務展示和公司介紹是獨立區段。 */
#service-design{margin-bottom:0;background:#f5f5f7;scroll-margin-top:102px}
#about-blj{background:#fff;border-top:1px solid #e6e6e8;scroll-margin-top:102px}
#about-blj>.wrap.section{padding-top:90px;padding-bottom:90px}