:root {
  --ink: #101211;
  --soft-ink: #414641;
  --paper: #e7e9e1;
  --white: #f6f7f2;
  --line: rgba(16, 18, 17, 0.18);
  --acid: #b5f23d;
  --dark: #171b19;
  --mono: "DM Mono", monospace;
  --sans: "Manrope", "Noto Sans SC", sans-serif;
  --cn: "Noto Sans SC", "Manrope", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--cn); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.container { width: min(1240px, calc(100% - 64px)); margin: 0 auto; }

.site-header { position: absolute; z-index: 10; top: 0; left: 0; width: 100%; height: 84px; padding: 0 max(32px, calc((100vw - 1240px) / 2)); display: flex; align-items: center; justify-content: space-between; color: var(--white); border-bottom: 1px solid rgba(255,255,255,.18); transition: background .25s, color .25s, height .25s; }
.site-header.is-scrolled { position: fixed; height: 68px; background: rgba(16,18,17,.9); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 8px; min-width: 270px; }
.brand-mark { position: relative; width: 24px; height: 24px; display: inline-block; border: 1px solid currentColor; transform: rotate(45deg); overflow: hidden; }
.brand-mark i { position: absolute; display: block; width: 100%; height: 50%; background: var(--acid); }
.brand-mark i:first-child { left: -50%; top: 0; }
.brand-mark i:last-child { right: -50%; bottom: 0; }
.brand-name { font-family: var(--sans); font-size: 20px; font-weight: 800; letter-spacing: 0; }
.brand-divider { height: 25px; width: 1px; background: currentColor; opacity: .4; margin: 0 2px; }
.brand-company { font: 500 8px/1.35 var(--mono); letter-spacing: .06em; }
.main-nav { display: flex; align-items: center; gap: 28px; font-size: 13px; font-weight: 600; }
.nav-link { opacity: .72; position: relative; padding: 32px 0; }
.nav-link:after { content: ""; position: absolute; left: 0; right: 0; bottom: 24px; height: 1px; background: var(--acid); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
.nav-link:hover, .nav-link.active { opacity: 1; }
.nav-link:hover:after, .nav-link.active:after { transform: scaleX(1); }
.header-actions { display: flex; align-items: center; gap: 18px; min-width: 270px; justify-content: flex-end; }
.language { font: 500 11px var(--mono); opacity: .75; }
.language span, .header-contact span { color: var(--acid); }
.header-contact { padding: 11px 15px; border: 1px solid rgba(255,255,255,.5); font-size: 12px; transition: background .2s, color .2s; }
.header-contact:hover { background: var(--acid); border-color: var(--acid); color: var(--ink); }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(255,255,255,.45); background: transparent; color: inherit; }
.menu-toggle span { display: block; width: 17px; height: 1px; background: currentColor; margin: 5px auto; }

.hero { --hero-pan-x: 0px; --hero-pan-y: 0px; position: relative; min-height: 780px; height: max(780px, 100vh); color: var(--white); overflow: hidden; background: #131615; }
.hero-photo { position: absolute; inset: 0; background-image: url("assets/hero-industrial-lab-v3.png"); background-size: cover; background-position: center; filter: grayscale(.18) contrast(1.03) brightness(.8) sepia(.03); transform: translate3d(var(--hero-pan-x), var(--hero-pan-y), 0) scale(1.035); transition: transform 1.2s cubic-bezier(.16, .72, .23, 1); will-change: transform; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,10,9,.44) 0%, rgba(8,10,9,.2) 44%, rgba(8,10,9,.06) 78%, rgba(8,10,9,.12) 100%), linear-gradient(0deg, rgba(8,10,9,.4), transparent 42%); }
.hero-grid { position: absolute; inset: 0; opacity: .27; background-image: linear-gradient(rgba(235,245,220,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(235,245,220,.18) 1px, transparent 1px); background-size: 78px 78px; mask-image: linear-gradient(to bottom, transparent 0%, #000 35%, transparent 100%); }
.hero-noise { position: absolute; inset: 0; opacity: .18; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E"); mix-blend-mode: screen; }
.hero-scan { position: absolute; z-index: 1; top: -22%; left: 61%; width: 1px; height: 144%; background: rgba(181,242,61,.58); box-shadow: 0 0 22px rgba(181,242,61,.38); opacity: 0; pointer-events: none; transform: rotate(23deg); animation: scan-sweep 17s ease-in-out infinite; }
.hero-content { position: relative; z-index: 2; padding-top: clamp(185px, 25vh, 250px); }
.eyebrow, .section-kicker { display: flex; align-items: center; gap: 10px; font: 500 10px/1.2 var(--mono); letter-spacing: .08em; }
.eyebrow { color: var(--acid); }
.eyebrow span { display: inline-block; width: 28px; height: 1px; background: var(--acid); }
.hero h1 { max-width: 880px; margin: 22px 0 20px; font: 700 clamp(50px, 6.4vw, 94px)/1.06 var(--cn); letter-spacing: 0; }
.hero-copy { max-width: 535px; margin: 0; color: rgba(246,247,242,.78); font-size: 16px; line-height: 1.8; }
.hero-actions { display: flex; align-items: center; gap: 27px; margin-top: 36px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 50px; padding: 0 18px; border: 1px solid transparent; font-size: 13px; font-weight: 700; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--acid); color: var(--ink); }
.button-primary span, .button-dark span { font-size: 19px; line-height: 0; }
.text-action { display: inline-flex; gap: 9px; align-items: center; padding-bottom: 7px; border-bottom: 1px solid rgba(255,255,255,.45); font-size: 13px; font-weight: 600; }
.text-action span { color: var(--acid); font-size: 16px; }
.hero-bottom { position: absolute; z-index: 2; bottom: 34px; left: 0; right: 0; display: flex; justify-content: space-between; align-items: center; font: 400 9px var(--mono); letter-spacing: .08em; color: rgba(246,247,242,.68); }
.hero-bottom a { color: var(--white); }.hero-bottom a span { color: var(--acid); padding-left: 6px; font-size: 15px; }
.hero-index { position: absolute; z-index: 2; right: 33px; bottom: 121px; display: flex; flex-direction: column; align-items: center; gap: 8px; font: 400 9px var(--mono); color: rgba(246,247,242,.65); }.hero-index i { display: block; height: 122px; width: 1px; background: rgba(246,247,242,.4); }

.intro { padding: 134px 0 0; }.section-kicker { color: var(--soft-ink); }.section-kicker span { color: #788072; }.section-kicker.light { color: rgba(246,247,242,.78); }.section-kicker.light span { color: var(--acid); }
.intro-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 50px; padding: 39px 0 110px; }.intro h2, .capabilities h2, .route-copy h2, .contact h2 { margin: 0; font: 700 clamp(35px, 4vw, 59px)/1.18 var(--cn); letter-spacing: 0; }.intro h2 em, .route-copy h2 em { color: #6e766c; font-style: normal; }
.intro-body { max-width: 460px; align-self: end; }.intro-body p { margin: 0; font-size: 16px; line-height: 2; color: #454b45; }.arrow-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 31px; padding-bottom: 7px; border-bottom: 1px solid var(--ink); font-size: 13px; font-weight: 700; }.arrow-link span { color: #6c9c00; font-size: 16px; }
.intro-strip { display: flex; gap: 21px; align-items: center; min-height: 70px; border-top: 1px solid var(--line); font: 500 10px var(--mono); color: #5f675e; letter-spacing: .06em; }.intro-strip i { width: 4px; height: 4px; background: var(--acid); transform: rotate(45deg); }

.sectors { background: var(--dark); color: var(--white); padding: 117px 0 105px; }.section-topline { display: flex; justify-content: space-between; align-items: flex-end; }.section-topline > p { width: min(350px, 34%); margin: 0; color: rgba(246,247,242,.62); font-size: 13px; line-height: 1.8; }.sectors h2 { margin: 42px 0 75px; font: 700 clamp(36px, 4.5vw, 62px)/1.18 var(--cn); }
.sector-list { border-top: 1px solid rgba(246,247,242,.25); }.sector-item { position: relative; display: grid; grid-template-columns: 100px minmax(0,1fr) 60px; gap: 25px; min-height: 184px; padding: 34px 10px 30px 0; border-bottom: 1px solid rgba(246,247,242,.22); overflow: hidden; transition: padding-left .3s; }.sector-item:before { content: ""; position: absolute; inset: 0; background: var(--acid); transform: translateX(-101%); transition: transform .38s cubic-bezier(.2,.7,.2,1); z-index: 0; }.sector-item > * { position: relative; z-index: 1; }.sector-item:hover { padding-left: 26px; color: var(--ink); }.sector-item:hover:before { transform: translateX(0); }.sector-number { font: 500 11px var(--mono); color: #a8b0a5; }.sector-item:hover .sector-number, .sector-item:hover .sector-tag { color: #40502a; }.sector-tag { margin: 0 0 12px; color: var(--acid); font: 500 10px var(--mono); letter-spacing: .09em; }.sector-content h3 { margin: 0 0 8px; font-size: 28px; letter-spacing: 0; }.sector-content > p:last-child { max-width: 595px; margin: 0; color: rgba(246,247,242,.62); font-size: 14px; line-height: 1.8; }.sector-item:hover .sector-content > p:last-child { color: rgba(16,18,17,.78); }.sector-go { align-self: start; justify-self: end; width: 43px; height: 43px; display: grid; place-items: center; border: 1px solid rgba(246,247,242,.5); font-size: 22px; transition: border-color .2s; }.sector-item:hover .sector-go { border-color: var(--ink); }

.products { padding: 123px 0 128px; background: #d9ddd4; }.products .section-topline > p { color: #556055; }.products h2 { margin: 39px 0 67px; font: 700 clamp(36px, 4.4vw, 61px)/1.16 var(--cn); }.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(16,18,17,.28); border-left: 1px solid rgba(16,18,17,.28); }.product-card { position: relative; min-height: 276px; padding: 20px 20px 22px; display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid rgba(16,18,17,.28); border-bottom: 1px solid rgba(16,18,17,.28); transition: transform .25s ease, background .25s ease, color .25s ease; }.product-card:hover { z-index: 1; background: var(--acid); color: var(--ink); transform: translateY(-6px); }.product-code { color: currentColor; opacity: .52; font: 500 10px var(--mono); letter-spacing: .07em; }.product-tag { margin: auto 0 11px; color: currentColor; opacity: .7; font: 500 9px var(--mono); letter-spacing: .08em; }.product-card h3 { max-width: 230px; margin: 0 0 8px; font: 700 21px/1.25 var(--cn); }.product-card > p:last-child { max-width: 240px; margin: 0; color: currentColor; opacity: .72; font-size: 12px; line-height: 1.7; }.product-card-light { background: #edf0e9; }.product-card-steel { background: #bbc3be; }.product-card-dark { color: var(--white); background: #303834; }.product-card-acid { background: #c8e68b; }.product-card-sand { background: #d5d8ca; }.product-card-slate { color: var(--white); background: #59625d; }.product-card-graphite { color: var(--white); background: #1d211f; }.product-card-white { background: #f2f3ee; }

.capabilities { padding: 132px 0 136px; }.capabilities-heading { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; }.capability-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 72px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.capability-card { min-height: 250px; padding: 23px 23px 25px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; }.capability-index { font: 500 11px var(--mono); color: #6f776d; }.capability-card h3 { margin: auto 0 14px; font-size: 20px; }.capability-card p { margin: 0; color: #596059; font-size: 13px; line-height: 1.8; }

.route-section { overflow: hidden; color: var(--white); background: #202724; }.route-layout { min-height: 580px; display: grid; grid-template-columns: .78fr 1.22fr; }.route-copy { padding: 102px 0; position: relative; z-index: 2; }.route-copy h2 { margin-top: 36px; }.route-copy h2 em { color: var(--acid); }.route-copy > p { max-width: 400px; margin: 25px 0 0; color: rgba(246,247,242,.65); font-size: 14px; line-height: 1.9; }.route-map { position: relative; min-height: 580px; overflow: hidden; background-image: linear-gradient(rgba(181,242,61,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(181,242,61,.08) 1px, transparent 1px); background-size: 54px 54px; }.route-lines { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; overflow: visible; }.route-line { fill: none; stroke: var(--acid); stroke-width: 1.5; vector-effect: non-scaling-stroke; }.route-to-cis { stroke-dasharray: 3 3; opacity: .82; animation: route-flow 7s linear infinite; }.route-to-sea { stroke-dasharray: 9 4; opacity: .94; animation: route-flow 8.5s linear infinite reverse; }.map-label { position: absolute; z-index: 2; font: 500 9px var(--mono); letter-spacing: .09em; }.map-label b { display: block; margin-top: 6px; color: var(--acid); font: 500 12px var(--cn); }.china { top: 42%; left: 62%; }.cis { top: 18%; left: 20%; }.sea { bottom: 19%; left: 54%; }.map-node { position: absolute; z-index: 2; display: block; width: 11px; height: 11px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 8px rgba(181,242,61,.1), 0 0 20px rgba(181,242,61,.85); animation: node-pulse 3.2s ease-in-out infinite; }.china-node { top: 48%; left: 58%; }.cis-node { top: 26%; left: 29%; animation-delay: .65s; }.sea-node { bottom: 26%; left: 66%; animation-delay: 1.3s; }

.js-ready [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .75s cubic-bezier(.16, .72, .23, 1); }.js-ready [data-reveal].is-visible { opacity: 1; transform: translateY(0); }
@keyframes scan-sweep { 0%, 20% { opacity: 0; transform: translateX(-16vw) rotate(23deg); } 26% { opacity: .9; } 43% { opacity: 0; transform: translateX(23vw) rotate(23deg); } 100% { opacity: 0; transform: translateX(23vw) rotate(23deg); } }
@keyframes route-flow { to { stroke-dashoffset: -90; } }
@keyframes node-pulse { 0%, 100% { box-shadow: 0 0 0 8px rgba(181,242,61,.1), 0 0 20px rgba(181,242,61,.68); } 50% { box-shadow: 0 0 0 14px rgba(181,242,61,.03), 0 0 28px rgba(181,242,61,.95); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

.contact { padding: 132px 0 126px; }.contact-layout { display: grid; grid-template-columns: .92fr 1.08fr; gap: 12%; }.contact-intro h2 { margin-top: 38px; font-size: clamp(34px, 3.8vw, 56px); }.contact-intro > p { max-width: 430px; margin: 25px 0 35px; color: #525952; font-size: 14px; line-height: 1.9; }.contact-directory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); }.contact-directory a { min-height: 66px; padding: 11px 12px 10px 0; display: flex; flex-direction: column; justify-content: center; gap: 5px; border-bottom: 1px solid var(--line); transition: color .2s; }.contact-directory a:nth-child(odd) { margin-right: 16px; }.contact-directory a:hover { color: #557800; }.contact-directory span { color: #778074; font: 500 8px var(--mono); letter-spacing: .07em; }.contact-directory strong { font: 600 12px var(--sans); letter-spacing: 0; overflow-wrap: anywhere; }
.inquiry-form { display: grid; grid-template-columns: 1fr 1fr; gap: 25px 28px; padding-top: 3px; }.inquiry-form label { display: flex; flex-direction: column; gap: 10px; }.inquiry-form label span { color: #657062; font: 500 10px var(--mono); letter-spacing: .06em; }.inquiry-form input, .inquiry-form select, .inquiry-form textarea { width: 100%; border: 0; border-bottom: 1px solid #757c72; border-radius: 0; outline: none; padding: 6px 0 9px; background: transparent; color: var(--ink); font-size: 14px; transition: border-color .2s; }.inquiry-form textarea { resize: vertical; min-height: 92px; }.inquiry-form input:focus, .inquiry-form select:focus, .inquiry-form textarea:focus { border-color: #557800; }.form-message { grid-column: 1 / -1; }.button-dark { width: max-content; background: var(--ink); color: var(--white); margin-top: 6px; }.button-dark:hover { background: #3b443b; }.form-status { grid-column: 1 / -1; min-height: 18px; margin: -15px 0 0; color: #5d760e; font-size: 12px; }

.site-footer { color: var(--white); background: #111412; }.footer-top { min-height: 168px; display: grid; grid-template-columns: .78fr 1.65fr 1fr; gap: 28px; align-items: center; border-bottom: 1px solid rgba(246,247,242,.17); }.footer-brand { min-width: 0; }.footer-company { align-self: center; padding-left: 25px; border-left: 1px solid rgba(246,247,242,.2); }.footer-company > p { margin: 0 0 10px; color: rgba(246,247,242,.85); font: 500 11px var(--mono); letter-spacing: .04em; }.footer-company address { max-width: 505px; margin: 0; color: rgba(246,247,242,.56); font: 400 11px/1.7 var(--sans); font-style: normal; }.footer-company address span { display: block; margin-bottom: 3px; color: var(--acid); font: 500 8px var(--mono); letter-spacing: .08em; }.footer-nav { justify-self: end; display: flex; gap: 20px; color: rgba(246,247,242,.75); font-size: 12px; }.footer-nav a:hover, .icp-link:hover { color: var(--acid); }.footer-bottom { min-height: 60px; display: flex; gap: 24px; align-items: center; justify-content: space-between; color: rgba(246,247,242,.43); font: 400 9px var(--mono); letter-spacing: .06em; }.icp-link { color: #f1513f; font: 600 14px var(--cn); letter-spacing: 0; transition: color .2s; }

@media (max-width: 860px) {
  .site-header { height: 70px; padding: 0 21px; }.brand { min-width: 0; }.main-nav, .language, .header-contact { display: none; }.header-actions { min-width: 0; }.menu-toggle { display: block; }.site-header.menu-open { position: fixed; background: var(--ink); }.site-header.menu-open .main-nav { display: flex; position: absolute; top: 70px; left: 0; width: 100%; min-height: calc(100vh - 70px); padding: 42px 21px; flex-direction: column; align-items: flex-start; gap: 0; background: var(--ink); }.site-header.menu-open .nav-link { width: 100%; padding: 18px 0; font-size: 25px; opacity: 1; border-bottom: 1px solid rgba(255,255,255,.15); }.site-header.menu-open .nav-link:after { display: none; }
  .container { width: min(100% - 42px, 640px); }.hero { min-height: 730px; height: 100svh; }.hero-photo { background-position: 60% center; }.hero-shade { background: linear-gradient(90deg, rgba(13,16,15,.93) 0%, rgba(13,16,15,.75) 100%), linear-gradient(0deg, rgba(13,16,15,.65), transparent 45%); }.hero-content { padding-top: 170px; }.hero h1 { font-size: clamp(43px, 12vw, 64px); }.hero-copy { font-size: 14px; line-height: 1.75; }.hero-bottom p:nth-child(2), .hero-index { display: none; }.hero-bottom { bottom: 25px; }.intro { padding-top: 85px; }.intro-layout, .capabilities-heading, .route-layout, .contact-layout { grid-template-columns: 1fr; }.intro-layout { gap: 31px; padding-bottom: 73px; }.intro-body { max-width: 100%; }.intro h2, .products h2, .capabilities h2, .route-copy h2, .contact h2 { font-size: clamp(32px, 9.2vw, 48px); }.intro-strip { flex-wrap: wrap; gap: 10px; padding: 19px 0; line-height: 1.7; }.intro-strip i { margin: 0 5px; }.sectors, .products { padding: 79px 0 72px; }.section-topline { align-items: flex-start; flex-direction: column; gap: 20px; }.section-topline > p { width: 100%; }.sectors h2, .products h2 { margin: 37px 0 45px; }.sector-item { grid-template-columns: 42px minmax(0,1fr) 44px; gap: 11px; min-height: 0; padding: 26px 0; }.sector-item:hover { padding-left: 13px; }.sector-content h3 { font-size: 21px; }.sector-content > p:last-child { font-size: 13px; }.sector-go { width: 36px; height: 36px; font-size: 18px; }.product-grid { grid-template-columns: 1fr 1fr; }.product-card { min-height: 220px; padding: 17px; }.product-card h3 { font-size: 18px; }.capabilities { padding: 83px 0; }.capabilities-heading { gap: 28px; }.capability-grid { grid-template-columns: 1fr 1fr; margin-top: 45px; }.capability-card { min-height: 220px; padding: 18px; }.capability-card h3 { font-size: 18px; }.route-layout { min-height: 0; }.route-copy { padding: 78px 0 38px; }.route-map { min-height: 370px; margin: 0 -21px; }.route-one { left: 20%; width: 43%; }.route-two { left: 56%; width: 29%; }.contact { padding: 83px 0; }.contact-layout { gap: 54px; }.contact-intro > p { margin-bottom: 38px; }.inquiry-form { gap: 25px; }.site-footer { padding-top: 5px; }.footer-top { min-height: 155px; grid-template-columns: 1fr; gap: 14px; padding: 26px 0; }.footer-company { padding: 13px 0; border-top: 1px solid rgba(246,247,242,.17); border-left: 0; }.footer-nav { justify-self: start; }.footer-bottom { min-height: 104px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 9px; }
}

@media (max-width: 430px) {
  .brand-company, .brand-divider { display: none; }.hero-actions { gap: 19px; }.hero-bottom { font-size: 8px; }.hero-bottom a { font-size: 0; }.hero-bottom a span { font-size: 16px; }.product-grid, .capability-grid { grid-template-columns: 1fr; }.product-card, .capability-card { min-height: 185px; }.contact-directory { grid-template-columns: 1fr; }.contact-directory a:nth-child(odd) { margin-right: 0; }.inquiry-form { grid-template-columns: 1fr; }
}