:root{--coral:#ff625a;--coral-dark:#ed4c45;--blue:#159dff;--navy:#14243d;--green:#13bd4b;--text:#1a2a42;--muted:#68768a;--shadow:0 18px 45px rgba(20,36,61,.10);--radius:24px}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{color:var(--text);background:#fffdfc;font-family:"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;font-size:1rem;line-height:1.75;overflow-x:hidden}
img{max-width:100%}a{text-decoration:none}
main{display:flex;flex-direction:column}
#home{order:1}#about{order:2}#services{order:3}#process{order:4}#partners{order:5}#portfolio{order:6}#contact{order:7}
.skip-link{position:fixed;top:-60px;left:1rem;z-index:2000;padding:.65rem 1rem;background:var(--navy);color:#fff;border-radius:.5rem;transition:top .2s}.skip-link:focus{top:1rem}
#mainNav{min-height:82px;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(20,36,61,.06);transition:.25s}
#mainNav.is-scrolled{min-height:70px;box-shadow:0 8px 30px rgba(20,36,61,.08)}
.navbar-brand{color:var(--navy);font-size:1.2rem;font-weight:900;letter-spacing:.02em}.navbar-brand img{border-radius:50%;object-fit:contain}
.navbar-nav .nav-link{color:#41506a;font-size:.94rem;font-weight:700;padding:.7rem .75rem!important;position:relative}
.navbar-nav .nav-link:after{content:"";position:absolute;left:.75rem;right:.75rem;bottom:.25rem;height:2px;background:var(--coral);transform:scaleX(0);transition:.2s}
.navbar-nav .nav-link:hover,.navbar-nav .nav-link.active{color:var(--coral)}.navbar-nav .nav-link.active:after{transform:scaleX(1)}
.btn{border-radius:999px;font-weight:800;padding:.78rem 1.45rem;transition:.2s}.btn:hover{transform:translateY(-2px)}
.btn-brand{color:#fff;border:0;background:linear-gradient(135deg,var(--coral),#ff7e67);box-shadow:0 10px 24px rgba(255,98,90,.28)}
.btn-brand:hover,.btn-brand:focus{color:#fff;background:var(--coral-dark)}
.nav-consult-btn{font-weight:600}
.btn-outline-brand{color:var(--blue);border:2px solid var(--blue);background:#fff}.btn-outline-brand:hover{color:#fff;background:var(--blue)}
.hero .btn{font-weight:600}
.section-shell{position:relative;overflow:hidden}.section-space{padding:6rem 0;position:relative}
.hero{min-height:760px;display:flex;align-items:center;padding:8.5rem 0 5.5rem;background:radial-gradient(circle at 73% 20%,rgba(255,98,90,.07),transparent 30%),#fff}
.eyebrow,.section-heading>span{display:inline-block;color:var(--coral);font-size:.78rem;font-weight:900;letter-spacing:.18em}
.hero h1{margin:1rem 0 1.2rem;color:var(--navy);font-size:clamp(2.35rem,4.2vw,4.25rem);font-weight:950;line-height:1.16;letter-spacing:-.04em}
.hero h1 span{color:var(--coral)}.hero h1 strong{color:var(--blue);font-weight:inherit}.hero-copy{max-width:35rem;color:var(--muted);font-size:1.12rem}
.hero-media{position:relative;isolation:isolate;overflow:hidden;border-radius:36px;filter:drop-shadow(0 25px 35px rgba(20,36,61,.14))}
.hero-media img{display:block;width:100%;border-radius:36px;aspect-ratio:3/2;object-fit:cover}
.floating-tag{position:absolute;display:flex;align-items:center;gap:.55rem;padding:.68rem 1rem;color:#fff;border-radius:12px;font-weight:800;box-shadow:0 10px 25px rgba(20,36,61,.18)}
.tag-video{left:37.5%;top:36.3%;transform:translate(-50%,-50%);background:var(--coral)}.tag-line{left:80.2%;top:37.1%;transform:translate(-50%,-50%);white-space:nowrap;background:var(--blue)}.tag-erp{right:2%;bottom:15%;background:var(--blue)}
.hero-service-label{position:absolute!important;z-index:10;display:flex!important;align-items:center;justify-content:center;gap:.5rem;box-sizing:border-box;width:160px;height:44px;padding:0 .75rem;color:#fff!important;border:1px solid rgba(255,255,255,.72);border-radius:12px;box-shadow:0 10px 25px rgba(20,36,61,.2);font-size:1rem;font-weight:600;line-height:1;visibility:visible!important;opacity:1!important}.hero-service-label i{flex:0 0 auto;font-size:1.05rem}.hero-service-label b{font-weight:600;white-space:nowrap}.hero-label-video{left:37.5%;top:36.3%;transform:translate(-50%,-50%);background:#ff625a}.hero-label-line{left:80.2%;top:37.1%;transform:translate(-50%,-50%);background:#199cff}.hero-label-erp{right:2%;bottom:15%;background:#199cff}
.hero-points>div{display:grid;grid-template-columns:2.2rem 1fr;align-items:center;column-gap:.25rem}.hero-points i{grid-row:1/3;color:var(--coral);font-size:1.55rem}.hero-points b{font-size:.9rem}.hero-points small{color:var(--muted);font-size:.72rem}
.hero-orb{position:absolute;border-radius:50%;pointer-events:none}.hero-orb-one{width:280px;height:280px;top:50px;right:-120px;border:2px solid rgba(21,157,255,.23)}.hero-orb-two{width:220px;height:220px;bottom:-130px;left:-90px;background:rgba(255,98,90,.07)}
.section-heading{max-width:720px;margin:0 auto 3rem;text-align:center}.section-heading:before{content:"";display:block;width:min(240px,58vw);height:30px;margin:0 auto .65rem;background:url("../images/section-divider-transparent.png") center/contain no-repeat}
.section-heading h2{margin:.3rem 0 .55rem;color:var(--coral);font-size:clamp(2rem,4vw,3rem);font-weight:950;letter-spacing:-.025em}.section-heading p{margin:0;color:var(--muted);font-size:1.05rem}
.section-tint-blue{background:linear-gradient(180deg,#f4faff,#f8fbfe)}.section-tint-coral{background:linear-gradient(180deg,#fff8f7,#fffaf9)}
.about-title{font-size:clamp(1.65rem,3vw,2.25rem);font-weight:900;line-height:1.45}
.metric-card,.service-card,.process-card,.work-card,.web-card{background:#fff;border:1px solid rgba(20,36,61,.055);border-radius:var(--radius);box-shadow:var(--shadow)}
.metric-card{min-height:190px;padding:2rem 1.15rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.metric-card i{color:var(--coral);font-size:2rem}.metric-card strong{color:var(--coral);font-size:2rem;font-weight:950}.metric-card span{color:var(--muted);font-size:.9rem}
.service-card{padding:2rem;transition:.25s}.service-card:hover,.work-card:hover,.web-card:hover{transform:translateY(-8px);box-shadow:0 24px 55px rgba(20,36,61,.15)}
.service-card h3,.work-card h3,.web-card h3{margin:1.1rem 0 .65rem;font-size:1.35rem;font-weight:900}.service-card p,.work-card p,.web-card p,.process-card p{color:var(--muted)}
.service-card ul{margin:1rem 0 0;padding:0;list-style:none;color:#536176;font-size:.92rem}.service-card li:before{content:"•";color:var(--coral);margin-right:.55rem}
.icon-box{width:66px;height:66px;display:grid;place-items:center;border-radius:19px;font-size:2rem}.icon-box.coral{color:var(--coral);background:#fff0ee}.icon-box.blue{color:var(--blue);background:#edf8ff}.icon-box.line{color:var(--green);background:#eefff3}
.process-card{position:relative;padding:2.2rem 1.6rem;text-align:center}.process-card>span{position:absolute;top:1rem;left:1rem;width:30px;height:30px;display:grid;place-items:center;color:#fff;background:var(--navy);border-radius:50%;font-size:.85rem;font-weight:900}.process-card>i{display:inline-block;margin-top:.8rem;color:var(--coral);font-size:2.2rem}.process-card h3{margin:1rem 0 .6rem;font-size:1.1rem;font-weight:900}.process-card p{margin:0;font-size:.92rem}
.service-card h3,.process-card h3{font-size:1.25rem;line-height:1.35}
.work-card,.web-card{overflow:hidden;transition:.25s}.work-image{position:relative;width:100%;height:auto;aspect-ratio:252/500;overflow:hidden;background:#f5f3f1}.work-image:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,rgba(8,20,37,.12));pointer-events:none}.work-image img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;transition:.3s}.work-card:hover img{filter:brightness(.97)}
.play-btn{position:absolute;z-index:1;left:50%;top:50%;width:64px;height:64px;transform:translate(-50%,-50%);display:grid;place-items:center;color:#fff;background:rgba(255,98,90,.9);border:2px solid #fff;border-radius:50%;font-size:1.8rem;transition:.2s}.play-btn:hover{transform:translate(-50%,-50%) scale(1.08);background:var(--coral-dark)}
.category{display:inline-block;padding:.25rem .75rem;color:var(--coral);background:#fff2f0;border:1px solid #ffc5c0;border-radius:999px;font-size:.75rem;font-weight:800}
.browser-bar{height:34px;display:flex;align-items:center;gap:6px;padding:0 14px;background:#fff;border-bottom:1px solid #edf0f4}.browser-bar i{width:7px;height:7px;border-radius:50%;background:#ff6b6b}.browser-bar i:nth-child(2){background:#ffd43b}.browser-bar i:nth-child(3){background:#51cf66}
.site-preview{display:block;width:100%;height:240px;object-fit:cover;object-position:center}.text-link{color:var(--blue);font-weight:800}
.contact-section{background:#fff}.contact-panel{padding:clamp(2rem,5vw,4.5rem);background:linear-gradient(125deg,#fff5f2,#f1f9ff);border:1px solid rgba(20,36,61,.06);border-radius:36px;box-shadow:var(--shadow)}.contact-panel h2{margin:.35rem 0 .8rem;font-size:clamp(1.55rem,2.7vw,2.35rem);font-weight:950}.contact-panel p{color:var(--muted)}
.contact-copy{display:flex;flex-direction:column;justify-content:center}.contact-actions{display:flex;align-items:center;flex-wrap:wrap;gap:1rem 1.25rem;margin-top:1.4rem}.contact-actions .social-row{margin:0}.social-row{display:flex;gap:.75rem}.social-row a{width:42px;height:42px;display:grid;place-items:center;color:#fff;background:var(--navy);border-radius:50%;transition:.2s}.social-row a:hover{transform:translateY(-3px);background:var(--coral)}
.contact-map-wrap{border-left:1px solid rgba(255,98,90,.28);padding-left:3rem}.contact-map{display:block;width:100%;min-height:340px;height:100%;border:0;border-radius:24px;box-shadow:0 14px 34px rgba(20,36,61,.13)}
.site-footer{padding:5rem 0 2rem;color:#cbd4e3;background:var(--navy)}.footer-brand{display:flex;align-items:center;gap:.8rem;color:#fff;font-size:1.25rem;font-weight:900}.footer-brand img{border-radius:50%;background:#fff}.site-footer p{max-width:30rem;margin:1.3rem 0 0}.site-footer h2{color:#fff;font-size:1rem;font-weight:900}.site-footer ul{margin:1.1rem 0 0;padding:0;list-style:none}.site-footer li{margin:.55rem 0}.site-footer a{color:#cbd4e3}.site-footer a:hover{color:#fff}.site-footer hr{margin:3rem 0 1.5rem;border-color:rgba(255,255,255,.15)}
.back-to-top{position:fixed;z-index:1000;right:1.2rem;bottom:1.2rem;width:46px;height:46px;display:grid;place-items:center;color:#fff;background:var(--blue);border:0;border-radius:50%;box-shadow:0 8px 25px rgba(21,157,255,.35);opacity:0;visibility:hidden;transform:translateY(12px);transition:.25s}.back-to-top.show{opacity:1;visibility:visible;transform:none}
.video-placeholder{min-height:260px;display:grid;place-items:center;align-content:center;gap:1rem;color:var(--muted);background:linear-gradient(135deg,#fff1ef,#edf8ff);border-radius:18px;text-align:center}.video-placeholder i{color:var(--coral);font-size:4rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}.reveal.is-visible{opacity:1;transform:none}.reveal-delay{transition-delay:.12s}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*{transition-duration:.01ms!important}}
@media(max-width:991.98px){#mainNav{background:rgba(255,255,255,.98)}.navbar-collapse{padding:1rem 0 1.5rem}.navbar-nav .nav-link:after{display:none}.hero{min-height:auto;padding-top:9rem}.section-space{padding:4.75rem 0}.contact-map-wrap{border-left:0;border-top:1px solid rgba(255,98,90,.28);padding:2rem 0 0}.contact-map{min-height:320px}}
@media(max-width:767.98px){.section-space{padding:4rem 0}.section-heading{margin-bottom:2.25rem}.hero h1{font-size:2.4rem}.hero-points>div{display:flex;flex-direction:column;text-align:center}.floating-tag{padding:.5rem .75rem;font-size:.78rem}.contact-panel{border-radius:25px}}
@media(max-width:575.98px){.navbar-brand span{font-size:1rem}.navbar-brand img{width:42px;height:42px}.hero h1{font-size:2.08rem}.hero-copy{font-size:1rem}.hero .btn{width:100%}.hero-media img{border-radius:24px}.hero-service-label{width:118px;height:34px;gap:.28rem;padding:0 .45rem;border-radius:9px;font-size:.67rem}.hero-service-label i{font-size:.82rem}.contact-actions{align-items:flex-start;flex-direction:column}.contact-map{min-height:280px;border-radius:18px}}
.site-footer{overflow:hidden}
main,.site-footer{overflow-x:hidden}.modal.show{background:rgba(20,36,61,.48)}

/* Section artwork */
#about{background-image:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.32)),url("../images/backgrounds/bg-glass-warm-v2.png");background-size:cover;background-position:center}
#services{background-image:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.32)),url("../images/backgrounds/bg-glass-cool-v2.png");background-size:cover;background-position:center}
#process{background-image:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.32)),url("../images/backgrounds/bg-glass-mix-v2.png");background-size:cover;background-position:center}
#partners{background-image:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.32)),url("../images/backgrounds/bg-glass-mix-v2.png");background-size:cover;background-position:center}
#portfolio{background-image:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.32)),url("../images/backgrounds/bg-glass-cool-v2.png");background-size:cover;background-position:center}
#contact{background-image:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.32)),url("../images/backgrounds/bg-glass-warm-v2.png");background-size:cover;background-position:center}
#contact .contact-panel{background:rgba(255,255,255,.82);backdrop-filter:blur(14px)}

/* Expandable case carousels */
.case-slider-wrap{position:relative}
.case-slider{display:flex;gap:1.5rem;overflow-x:auto;padding:.6rem .25rem .75rem;background:transparent;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none}
.case-slider::-webkit-scrollbar{display:none}
.case-slide{flex:0 0 calc((100% - 3rem)/3);min-width:0;scroll-snap-align:start}
#partnerSlider .case-slide{flex-basis:calc((100% - 6rem)/5)}
.case-slide .work-card,.case-slide .web-card{height:100%;box-shadow:none;border:1px solid rgba(20,36,61,.09)}
.case-slide .work-card:hover,.case-slide .web-card:hover{box-shadow:0 12px 26px rgba(20,36,61,.09)}
.case-slide .work-card{display:flex;flex-direction:column}.case-slide .work-card>.p-4{flex:1}
.slider-arrow{position:absolute;z-index:4;top:48%;width:48px;height:48px;display:grid;place-items:center;border:0;border-radius:50%;color:var(--navy);background:rgba(255,255,255,.94);box-shadow:0 10px 28px rgba(20,36,61,.18);font-size:1.2rem;transition:.2s}
.slider-arrow:hover,.slider-arrow:focus-visible{color:#fff;background:var(--coral);transform:translateY(-2px)}
.slider-prev{left:-24px}.slider-next{right:-24px}
@media(max-width:991.98px){.case-slide,#partnerSlider .case-slide{flex-basis:calc((100% - 1.5rem)/2)}.slider-prev{left:-8px}.slider-next{right:-8px}}
@media(max-width:575.98px){.case-slide,#partnerSlider .case-slide{flex-basis:100%}.slider-arrow{width:42px;height:42px}.slider-prev{left:4px}.slider-next{right:4px}#about,#services,#process,#partners,#portfolio,#contact{background-position:center;background-size:auto 100%}}
