@font-face{font-family:'Urbanist';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/urbanist-400.woff2') format('woff2')}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/urbanist-500.woff2') format('woff2')}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/urbanist-600.woff2') format('woff2')}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/urbanist-700.woff2') format('woff2')}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/urbanist-800.woff2') format('woff2')}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:900;font-display:swap;src:url('fonts/urbanist-900.woff2') format('woff2')}
@font-face{font-family:'Sometype Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/sometype-mono-500.woff2') format('woff2')}
@font-face{font-family:'Noto Sans SC';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/noto-sans-sc-400.woff2') format('woff2')}
@font-face{font-family:'Noto Sans SC';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/noto-sans-sc-500.woff2') format('woff2')}
@font-face{font-family:'Noto Sans SC';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/noto-sans-sc-700.woff2') format('woff2')}

:root{
 --teal-900:#00505B;--teal-800:#005e6b;--teal-700:#00707F;--teal-500:#00A1B6;--teal-300:#66C7D3;--teal-100:#CCECF0;--teal-050:#EBF7F9;
 --red-500:#CB3E35;--red-700:#9E2F28;--red-100:#F5DCDA;
 --gray-700:#5C6063;--gray-500:#ADB0B2;--gray-300:#D6D8D9;--gray-100:#F2F3F3;
 --ink:#1c1817;--paper:#fff;
 --sans:'Urbanist','Noto Sans SC',system-ui,sans-serif;--mono:'Sometype Mono','Noto Sans SC',monospace;--max:1360px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.5;-webkit-font-smoothing:antialiased}
.lang-zh{font-family:'Noto Sans SC','Urbanist',sans-serif}
a{text-decoration:none;color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 40px}
.eyebrow{font-family:var(--mono);font-size:16px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-500);display:inline-flex;align-items:center;gap:9px}.eyebrow::before{content:"";width:0;height:0;border-left:9px solid var(--red-500);border-top:6px solid transparent;border-bottom:6px solid transparent;display:inline-block;flex:none}
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:20px;padding:15px 26px;border-radius:10px;border:none;cursor:pointer;transition:.2s;font-family:var(--sans);white-space:nowrap}
.btn svg{width:18px;height:18px}
.btn-red{background:var(--red-500);color:#fff}.btn-red:hover{background:var(--red-700)}
.btn-teal{background:var(--teal-500);color:#fff}.btn-teal:hover{background:var(--teal-700)}
.btn-white{background:#fff;color:var(--teal-900)}.btn-white:hover{background:var(--teal-050)}
.btn-outline{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55)}.btn-outline:hover{background:rgba(255,255,255,.12)}
h1,h2,h3{letter-spacing:-.02em;line-height:1.05}
.zh{display:none}
body.lang-zh .en{display:none}
body.lang-zh .zh{display:inline}
/* header */
header{position:fixed;top:0;left:0;right:0;z-index:100;transition:.3s}
header.solid{background:rgba(28,24,23,.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px}
.brand{display:flex;align-items:center;gap:11px;color:#fff}
.brand svg{width:34px;height:31px;flex:none}.brand b{font-size:20px;font-weight:800}
.nav-links{display:flex;gap:36px}
.nav-links a{color:#fff;font-weight:600;font-size:20px;opacity:.9;transition:.2s}
.nav-links a:hover,.nav-links a.active{opacity:1;color:var(--teal-300)}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-right .btn{height:36px;padding:0 18px;font-size:13px;border-radius:9px}
.lt{display:flex;align-items:stretch;height:36px;border:1.5px solid rgba(255,255,255,.3);border-radius:9px;overflow:hidden;font-family:var(--mono);font-size:12px}
.lt button{border:none;background:transparent;color:#fff;padding:0 11px;cursor:pointer;font-family:var(--mono);opacity:.7;display:flex;align-items:center}
.lt button.on{background:var(--teal-500);opacity:1}
/* page hero */
.phero{position:relative;min-height:66vh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.phero-img{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.03)}
.phero-ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,24,23,.5),rgba(0,80,91,.4) 45%,rgba(28,24,23,.9))}
.phero .wrap{position:relative;padding-bottom:80px;padding-top:160px;width:100%}
.phero .eyebrow{color:var(--teal-300)}
.phero h1{font-size:clamp(40px,4vw,52px);font-weight:800;max-width:18ch;margin-top:14px}
.phero p{margin-top:22px;font-size:20px;max-width:56ch;color:rgba(255,255,255,.9)}
/* hero (home) */
.hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.hero-img{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.03)}
.hero-ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,24,23,.55),rgba(0,80,91,.35) 40%,rgba(28,24,23,.88))}
.hero .wrap{position:relative;padding-bottom:80px;padding-top:160px;width:100%}
.hero h1{font-size:clamp(44px,6vw,80px);font-weight:800;max-width:17ch}.hero h1 .hl{color:var(--teal-300)}
.hero .sub{margin:28px 0 36px;font-size:20px;max-width:52ch;color:rgba(255,255,255,.9)}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
/* sections */
.sec{padding:160px 0}
.sec-head{max-width:660px;margin-bottom:48px}
.sec-head h2{font-size:clamp(36px,3.2vw,40px);font-weight:800;margin:14px 0 16px}
.sec-head p{font-size:20px;color:var(--gray-700)}
/* caps strip */
.caps{background:var(--teal-050);border-bottom:1px solid var(--teal-100)}
.caps .grid{display:grid;grid-template-columns:repeat(4,1fr)}
.cap{padding:38px 30px;display:flex;flex-direction:column;gap:12px;border-right:1px solid var(--teal-100)}
.cap:last-child{border-right:none}.cap svg{width:30px;height:30px;color:var(--teal-500)}
.cap b{font-size:20px;font-weight:700;color:var(--teal-900)}.cap span{font-size:13px;color:var(--gray-700)}
/* partners */
.partners{padding:56px 0;background:var(--teal-900)}
.partners .lbl{text-align:center;font-family:var(--mono);font-size:16px;letter-spacing:.2em;text-transform:uppercase;color:#9CC7CE;margin-bottom:34px}
.prow{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pcol{height:88px;position:relative;overflow:hidden}
.plg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:opacity .55s ease,transform .55s ease,filter .55s ease}
.plg img{width:78%;max-width:250px;height:auto;object-fit:contain;opacity:.94}
.plg.out{opacity:0;transform:translateY(-16px);filter:blur(6px)}
.plg.in{opacity:0;transform:translateY(16px);filter:blur(6px)}
.plg.show{opacity:1;transform:none;filter:none}
@media(prefers-reduced-motion:reduce){.plg{transition:opacity .5s ease}.plg.out,.plg.in{transform:none;filter:none}}
/* service detail rows */
.svcd{display:grid;grid-template-columns:88px 1fr;gap:30px;padding:44px 0;border-top:1px solid var(--gray-300)}
.svcd .no{font-family:var(--mono);font-size:16px;color:var(--teal-500);font-weight:500}
.svcd h3{font-size:24px;font-weight:700;margin-bottom:12px}
.svcd .lead{font-size:20px;color:var(--gray-700);max-width:66ch;line-height:1.65;margin-bottom:24px}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feat .f{border-left:2px solid var(--teal-300);padding:4px 0 4px 16px}
.feat .f b{display:block;font-size:20px;font-weight:700;color:var(--teal-900);margin-bottom:4px}
.feat .f span{font-size:13px;color:var(--gray-700)}
/* what sets apart */
.apart{background:var(--gray-100)}
.apart-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.apart-c{background:#fff;border-radius:16px;padding:32px}
.apart-c .ic{width:46px;height:46px;border-radius:12px;background:var(--teal-050);display:flex;align-items:center;justify-content:center;color:var(--teal-500);margin-bottom:18px}
.apart-c .ic svg{width:24px;height:24px}
.apart-c h3{font-size:20px;font-weight:700;margin-bottom:8px}.apart-c p{font-size:20px;color:var(--gray-700);line-height:1.6}
/* process */
.proc{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.proc .step{padding-top:22px;border-top:2px solid var(--teal-500)}
.proc .step .n{font-family:var(--mono);font-size:13px;color:var(--teal-500)}
.proc .step h4{font-size:20px;font-weight:700;margin:8px 0 6px}
.proc .step p{font-size:13px;color:var(--gray-700);line-height:1.55}
/* industries dark */
.industries{background:var(--teal-900);color:#fff}
.industries .sec-head h2{color:#fff}.industries .sec-head p{color:var(--teal-100)}
.ind-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ind{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:30px;transition:.25s}
.ind:hover{background:rgba(255,255,255,.08);transform:translateY(-3px)}
.ind .tag{font-family:var(--mono);font-size:16px;letter-spacing:.12em;color:var(--teal-300);background:rgba(102,199,211,.12);padding:4px 10px;border-radius:999px;display:inline-block}
.ind h3{font-size:20px;font-weight:700;margin:16px 0 10px}.ind p{font-size:13px;color:var(--teal-100);line-height:1.6}
.ind ul{margin-top:14px;list-style:none;display:flex;flex-direction:column;gap:7px}
.ind li{font-size:13px;color:var(--teal-100);padding-left:18px;position:relative}
.ind li:before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--teal-300)}
/* why */
.why{display:grid;grid-template-columns:1fr 1.05fr;gap:70px;align-items:center}
.why-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.why-card{background:var(--gray-100);border-radius:14px;padding:24px;display:flex;flex-direction:column;gap:12px}
.why-card .ic{width:44px;height:44px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--teal-500)}
.why-card .ic svg{width:22px;height:22px}.why-card b{font-size:20px;font-weight:700}.why-card span{font-size:13px;color:var(--gray-700)}
/* cta */
.cta{background:var(--teal-900);color:#fff;text-align:center;padding:52px 0}
.cta h2{font-size:clamp(32px,3.2vw,40px);font-weight:800;margin-bottom:22px}.cta h2::before{content:"";display:inline-block;vertical-align:middle;margin-right:14px;width:0;height:0;border-left:13px solid var(--red-500);border-top:8px solid transparent;border-bottom:8px solid transparent}
/* footer */
footer{background:var(--ink);color:#b6b0af;padding:80px 0 36px}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.1)}
.fbrand{display:flex;align-items:center;gap:11px;color:#fff;margin-bottom:20px}
.fbrand svg{width:32px;height:29px}.fbrand b{font-size:20px;font-weight:800}
footer p{font-size:13px;line-height:1.6;color:#9e9694;max-width:34ch}
footer h4{color:#fff;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px}
footer .fcol a{display:block;font-size:20px;color:#cfcac9;margin-bottom:11px;transition:.2s}
footer .fcol a:hover{color:var(--teal-300)}
.fbot{padding-top:26px;font-size:13px;color:#867c79}
@media(max-width:960px){
 .nav-links{display:none}
 .caps .grid{grid-template-columns:1fr 1fr}.cap{border-bottom:1px solid var(--teal-100)}
 .ind-grid,.why{grid-template-columns:1fr;gap:36px}
 .feat,.apart-grid,.proc{grid-template-columns:1fr}
 .prow{grid-template-columns:1fr 1fr;row-gap:6px}.fgrid{grid-template-columns:1fr;gap:32px}
 .svcd{grid-template-columns:1fr;gap:12px}.sec{padding:80px 0}.wrap{padding:0 16px}
}
.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* chevron motif */
.chev{position:relative}
.chev>.wrap{position:relative;z-index:1}
.chev::before{content:"";position:absolute;inset:0;z-index:0;background-repeat:repeat;background-size:120px 120px}
.chev.cl::before{background-image:url('assets/img/chevron.svg');opacity:.05}
.chev.cd::before{background-image:url('assets/img/chevron-w.svg');opacity:.06}
/* home services: sticky title + image cards */
.svcwrap{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;align-items:start}
.svcwrap .stitle{position:sticky;top:110px}
.scards{display:flex;flex-direction:column;gap:46px}
.scard{display:block;color:inherit}
.scard .top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.scard .dot{width:0;height:0;border-left:10px solid var(--red-500);border-top:6px solid transparent;border-bottom:6px solid transparent}
.scard .no{font-family:var(--mono);font-size:16px;color:var(--gray-500)}
.scard h3{font-size:24px;font-weight:700;margin-bottom:16px;transition:.2s}
.scard:hover h3{color:var(--teal-700)}
.scard .im{height:320px;border-radius:16px;background-size:cover;background-position:center;box-shadow:0 20px 40px rgba(0,80,91,.12)}
/* home industries: image cards */
.icards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.icard{border-radius:18px;overflow:hidden;position:relative;display:block;color:#fff;min-height:280px;border:1px solid rgba(255,255,255,.12)}
.icard .im{position:absolute;inset:0;background-size:cover;background-position:center;transition:.4s}
.icard:hover .im{transform:scale(1.05)}
.icard .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,80,91,.1),rgba(0,42,48,.85))}
.icard .cap{position:absolute;left:0;right:0;bottom:0;padding:24px}
.icard .tag{font-family:var(--mono);font-size:16px;letter-spacing:.12em;color:var(--teal-300)}
.icard h3{font-size:24px;font-weight:700;margin-top:6px}
.indhead{max-width:520px;margin-bottom:48px}
.indhead .btn{margin-top:22px}
@media(max-width:960px){.svcwrap{grid-template-columns:1fr;gap:30px}.svcwrap .stitle{position:static}.icards{grid-template-columns:1fr}.scard .im{height:220px}}

.scrollcue .tri{width:0;height:0;border-top:10px solid var(--red-500);border-left:7px solid transparent;border-right:7px solid transparent;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.ihsec{background:var(--teal-050)}
.ihcards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ihcard{background:#fff;border:1px solid var(--teal-100);border-radius:18px;overflow:hidden;display:block;color:inherit;transition:.25s;box-shadow:0 12px 30px rgba(0,80,91,.06)}
.ihcard:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(0,80,91,.13)}
.ihcard .im{height:184px;background-size:cover;background-position:center}
.ihcard .body{padding:22px 24px 26px}
.ihcard .top{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.ihcard .tri{width:0;height:0;border-left:9px solid var(--red-500);border-top:6px solid transparent;border-bottom:6px solid transparent;flex:none}
.ihcard .tag{font-family:var(--mono);font-size:16px;letter-spacing:.12em;color:var(--teal-500)}
.ihcard h3{font-size:20px;font-weight:700;color:var(--ink);margin-bottom:6px}
.ihcard p{font-size:13px;color:var(--gray-700);line-height:1.55}
@media(max-width:900px){.ihcards{grid-template-columns:1fr}}

/* mobile nav — hamburger menu */
.brand b{white-space:nowrap}
.navtog{display:none;width:42px;height:42px;flex:none;border:1.5px solid rgba(255,255,255,.3);border-radius:9px;background:transparent;cursor:pointer;position:relative;padding:0}
.navtog span{position:absolute;top:50%;left:50%;width:18px;height:2px;background:#fff;border-radius:2px;transform:translate(-50%,-50%);transition:.25s}
.navtog span::before,.navtog span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:#fff;border-radius:2px;transition:.25s}
.navtog span::before{top:-6px}
.navtog span::after{top:6px}
#hdr.open .navtog span{background:transparent}
#hdr.open .navtog span::before{top:0;transform:rotate(45deg)}
#hdr.open .navtog span::after{top:0;transform:rotate(-45deg)}
@media(max-width:960px){
 .navtog{display:flex}
 .nav{flex-wrap:wrap;height:auto;min-height:80px}
 .brand{margin-right:auto}
 .brand b{font-size:20px}
 .nav-links{order:5;flex-basis:100%;flex-direction:column;gap:0;padding:6px 0 12px}
 .nav-links a{padding:13px 2px;font-size:20px;opacity:1;border-top:1px solid rgba(255,255,255,.08)}
 .nav-right{order:6;flex-basis:100%;display:none;justify-content:flex-start;gap:16px;padding:2px 0 18px}
 #hdr.open{background:rgba(28,24,23,.98);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}
 #hdr.open .nav-links{display:flex}
 #hdr.open .nav-right{display:flex}
}

/* img-in-card (webp/lazy swap) */
.im>img,.simg>img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.im{overflow:hidden}
/* CTA tagline link */
.cta .ctalink{color:var(--teal-300);text-decoration:none;transition:color .25s ease;white-space:nowrap}
.cta .ctalink::after{content:"";display:inline-block;width:0;height:0;border-left:.42em solid var(--red-500);border-top:.28em solid transparent;border-bottom:.28em solid transparent;margin-left:.35em;vertical-align:baseline;transition:transform .25s ease}
.cta .ctalink:hover{color:var(--red-500)}
.cta .ctalink:hover::after{transform:translateX(.18em)}

.sec-head .eyebrow{margin-bottom:8px}
/* a11y: keyboard focus (focus-visible only, invisible to mouse users) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--teal-500);outline-offset:3px;border-radius:6px}
header a:focus-visible,header button:focus-visible{outline-color:var(--teal-300)}
@media(prefers-reduced-motion:reduce){*,::before,::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}