/*
Theme Name: Tianfa Global
Theme URI: http://tianfashengwu.com/
Author: Tianfa
Description: A bilingual corporate website for Hebei Tianfa Biotechnology.
Version: 3.1.1
Text Domain: tianfa-global
*/

:root {
	--ink: #10241c;
	--ink-soft: #4f6259;
	--green-950: #061f17;
	--green-900: #0a2c20;
	--green-800: #0b3928;
	--green-700: #0f5d3c;
	--green-600: #17764b;
	--green-500: #2c935c;
	--lime: #a4d84e;
	--lime-light: #d9f5a4;
	--aqua: #8bd8c8;
	--sand: #f2efe6;
	--paper: #f8faf7;
	--white: #ffffff;
	--line: rgba(16, 36, 28, .13);
	--shadow: 0 24px 70px rgba(5, 33, 23, .12);
	--radius: 22px;
	--container: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
	margin: 0;
	color: var(--ink);
	background: var(--paper);
	font-family: "DM Sans", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
svg { display: block; }
[hidden] { display: none !important; }
.container { width: min(calc(100% - 48px), var(--container)); margin-inline: auto; }
.section { padding: 130px 0; }
.section-dark { color: var(--white); background: var(--green-950); }
.skip-link { position: fixed; z-index: 9999; top: 10px; left: 10px; padding: 10px 16px; color: var(--white); background: var(--green-600); transform: translateY(-150%); transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.75,.25,1); }
.js .reveal.is-visible { opacity: 1; transform: translateY(0); }

.site-header {
	position: fixed;
	z-index: 1000;
	top: 0;
	left: 0;
	width: 100%;
	color: var(--white);
	border-bottom: 1px solid rgba(255,255,255,.1);
	transition: background .3s ease, box-shadow .3s ease, color .3s ease;
}
.site-header.is-scrolled { color: var(--ink); background: rgba(248, 250, 247, .93); box-shadow: 0 8px 30px rgba(5, 33, 23, .08); backdrop-filter: blur(16px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 82px; gap: 32px; }
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 10px; }
.brand-mark { width: 44px; height: 44px; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-copy strong { font-family: "Manrope", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: .12em; }
.brand-copy small { margin-top: 5px; font-size: 8px; font-weight: 700; letter-spacing: .2em; opacity: .72; }
.desktop-nav { display: flex; align-items: center; justify-content: center; gap: 32px; margin-left: auto; }
.desktop-nav a { position: relative; font-size: 13px; font-weight: 600; }
.desktop-nav a::after { position: absolute; right: 0; bottom: -8px; left: 0; height: 1px; content: ""; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .25s; }
.desktop-nav a:hover::after, .desktop-nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.header-actions { display: flex; align-items: center; gap: 16px; }
.language-toggle { display: inline-flex; align-items: center; gap: 5px; padding: 7px; color: inherit; border: 0; background: transparent; cursor: pointer; font-size: 12px; font-weight: 700; }
.language-option { opacity: .45; transition: opacity .2s; }
.language-option.is-active { opacity: 1; }
.language-divider { opacity: .35; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 24px; color: var(--white); border: 1px solid var(--green-600); border-radius: 999px; background: var(--green-600); font-size: 14px; font-weight: 700; transition: color .25s, background .25s, border .25s, transform .25s; cursor: pointer; }
.button:hover, .button:focus-visible { color: var(--green-900); background: var(--lime); border-color: var(--lime); transform: translateY(-2px); }
.button-small { min-height: 42px; padding-inline: 18px; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.08); }
.is-scrolled .button-small { color: var(--white); border-color: var(--green-600); background: var(--green-600); }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 0; color: inherit; border: 0; background: transparent; cursor: pointer; }
.menu-toggle span { display: block; width: 22px; height: 1px; margin: 7px auto; background: currentColor; transition: transform .25s; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
.mobile-nav { display: none; }

.hero { position: relative; min-height: 860px; padding: 155px 0 78px; overflow: hidden; background: radial-gradient(circle at 82% 45%, rgba(36, 120, 75, .42), transparent 28%), linear-gradient(130deg, #061e16 10%, #0a3022 60%, #0d422c); }
.hero-grid { position: absolute; inset: 0; opacity: .11; background-image: linear-gradient(rgba(255,255,255,.25) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.25) 1px, transparent 1px); background-size: 72px 72px; -webkit-mask-image: linear-gradient(to right, transparent, #000 45%, #000); mask-image: linear-gradient(to right, transparent, #000 45%, #000); }
.hero::before { position: absolute; top: -25%; left: -16%; width: 620px; height: 620px; content: ""; border: 1px solid rgba(164, 216, 78, .18); border-radius: 50%; box-shadow: 0 0 0 100px rgba(164,216,78,.025), 0 0 0 200px rgba(164,216,78,.018); }
.hero-orbit { position: absolute; border: 1px solid rgba(165, 230, 121, .16); border-radius: 50%; }
.hero-orbit-one { right: -120px; bottom: -260px; width: 720px; height: 720px; }
.hero-orbit-two { right: 180px; bottom: -130px; width: 430px; height: 430px; }
.hero-layout { position: relative; z-index: 2; display: grid; grid-template-columns: 1.04fr .96fr; align-items: center; gap: 65px; min-height: 610px; }
.hero-copy { max-width: 690px; }
.eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; color: rgba(255,255,255,.72); font-family: "Manrope", sans-serif; font-size: 11px; font-weight: 800; letter-spacing: .18em; }
.eyebrow > span:first-child { width: 34px; height: 1px; background: var(--lime); }
.eyebrow-green { color: var(--green-700); }
.hero h1, .section-heading h2, .application-heading h2, .contact-copy h2 { margin: 0; font-family: "Manrope", "Microsoft YaHei", sans-serif; font-weight: 700; letter-spacing: -.05em; line-height: 1.02; }
.hero h1 { max-width: 720px; font-size: clamp(52px, 6vw, 88px); }
.hero h1 em { color: var(--lime); font-style: normal; }
.hero-lead { max-width: 610px; margin: 30px 0 0; color: rgba(255,255,255,.7); font-size: 18px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 30px; margin-top: 38px; }
.button-light { color: var(--green-950); border-color: var(--lime); background: var(--lime); }
.button-light svg { width: 18px; margin-left: 12px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.text-link { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; }
.text-link span { color: var(--lime); font-size: 19px; transition: transform .25s; }
.text-link:hover span { transform: translate(3px, -3px); }
.hero-proof { display: flex; align-items: center; gap: 12px; margin-top: 45px; color: rgba(255,255,255,.55); font-size: 12px; letter-spacing: .04em; }
.hero-proof p { margin: 0; }
.proof-dot { position: relative; width: 9px; height: 9px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 6px rgba(164,216,78,.08); }
.proof-dot::after { position: absolute; inset: -6px; content: ""; border: 1px solid var(--lime); border-radius: 50%; animation: pulse 2s infinite; }
@keyframes pulse { 0% { opacity: .8; transform: scale(.7); } 70%,100% { opacity: 0; transform: scale(1.45); } }
.hero-visual { position: relative; min-height: 550px; }
.science-card { position: absolute; top: 32px; right: 25px; width: min(100%, 430px); min-height: 510px; padding: 26px; overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: 34px; background: linear-gradient(155deg, rgba(255,255,255,.13), rgba(255,255,255,.025)); box-shadow: 0 45px 100px rgba(0,0,0,.28); backdrop-filter: blur(18px); transform: rotate(2deg); }
.science-card::before { position: absolute; inset: 0; content: ""; background: radial-gradient(circle at 72% 20%, rgba(164,216,78,.22), transparent 28%); }
.science-card-top, .science-card-bottom { position: relative; z-index: 2; display: flex; justify-content: space-between; gap: 20px; }
.science-card-top { color: rgba(255,255,255,.58); font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.science-card-top strong { color: var(--lime); }
.drop-visual { position: relative; display: flex; align-items: center; justify-content: center; height: 340px; }
.drop-core { position: relative; z-index: 3; width: 122px; height: 160px; border-radius: 65% 35% 65% 35% / 70% 45% 55% 30%; background: linear-gradient(140deg, rgba(228,255,193,.92), rgba(105,204,139,.55) 47%, rgba(22,105,75,.22)); box-shadow: inset 18px 18px 35px rgba(255,255,255,.38), inset -20px -25px 45px rgba(7,65,43,.36), 0 22px 60px rgba(111,218,127,.22); transform: rotate(45deg); }
.drop-core::after { position: absolute; top: 23px; left: 26px; width: 30px; height: 50px; content: ""; border-radius: 50%; background: rgba(255,255,255,.55); filter: blur(5px); }
.drop-ring { position: absolute; border: 1px solid rgba(174, 231, 107, .32); border-radius: 50%; animation: slowSpin 14s linear infinite; }
.drop-ring::before { position: absolute; top: 8%; left: 14%; width: 8px; height: 8px; content: ""; border-radius: 50%; background: var(--lime); box-shadow: 0 0 20px var(--lime); }
.drop-ring-a { width: 230px; height: 230px; }
.drop-ring-b { width: 285px; height: 185px; transform: rotate(35deg); animation-duration: 18s; animation-direction: reverse; }
.drop-ring-c { width: 185px; height: 285px; transform: rotate(-25deg); animation-duration: 21s; }
@keyframes slowSpin { to { rotate: 360deg; } }
.science-card-bottom { align-items: flex-end; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.12); }
.science-card-bottom div { display: flex; flex-direction: column; gap: 5px; }
.science-card-bottom small { color: rgba(255,255,255,.45); font-size: 8px; letter-spacing: .14em; }
.science-card-bottom strong { font-size: 12px; }
.hero-badge { position: absolute; z-index: 5; right: -5px; bottom: 20px; display: flex; flex-direction: column; justify-content: center; width: 148px; height: 148px; padding: 20px; color: var(--green-950); border-radius: 50%; background: var(--lime); box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.hero-badge strong { font-family: "Manrope"; font-size: 33px; line-height: 1; letter-spacing: -.05em; }
.hero-badge strong span { font-size: 17px; }
.hero-badge small { margin-top: 7px; font-size: 9px; font-weight: 700; line-height: 1.35; }
.molecule { position: absolute; z-index: 4; }
.molecule i { position: absolute; width: 10px; height: 10px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; background: rgba(164,216,78,.25); }
.molecule i::after { position: absolute; top: 4px; left: 7px; width: 42px; height: 1px; content: ""; background: rgba(255,255,255,.2); transform-origin: left; }
.molecule-a { top: 0; left: 25px; }
.molecule-a i:nth-child(2) { left: 45px; top: 20px; }.molecule-a i:nth-child(2)::after { transform: rotate(85deg); width: 35px; }.molecule-a i:nth-child(3) { left: 40px; top: 57px; }
.molecule-b { right: 80px; bottom: 90px; transform: scale(.8); }
.molecule-b i:nth-child(2) { left: 45px; top: -24px; }.molecule-b i:nth-child(2)::after { transform: rotate(130deg); }.molecule-b i:nth-child(3) { left: -1px; top: 35px; }
.hero-ticker { position: absolute; right: 0; bottom: 0; left: 0; overflow: hidden; border-top: 1px solid rgba(255,255,255,.1); background: rgba(3,22,15,.35); }
.ticker-track { display: flex; align-items: center; width: max-content; min-height: 58px; animation: ticker 30s linear infinite; }
.ticker-track span { margin-inline: 35px; color: rgba(255,255,255,.5); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.ticker-track i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); opacity: .65; }
@keyframes ticker { to { transform: translateX(-50%); } }

.trust-strip { padding: 0; border-bottom: 1px solid var(--line); background: var(--white); }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.trust-grid > div { display: flex; flex-direction: column; justify-content: center; min-height: 150px; padding: 28px 35px; border-right: 1px solid var(--line); }
.trust-grid > div:first-child { border-left: 1px solid var(--line); }
.trust-grid strong { color: var(--green-800); font-family: "Manrope"; font-size: 37px; letter-spacing: -.05em; line-height: 1; }
.trust-grid strong sup { margin-left: 3px; font-size: 15px; }
.trust-grid span { margin-top: 12px; color: var(--ink-soft); font-size: 12px; }

.intro-section { background: var(--paper); }
.intro-layout { display: grid; grid-template-columns: 1fr .82fr; gap: 130px; align-items: end; }
.section-heading h2, .application-heading h2, .contact-copy h2 { font-size: clamp(40px, 5vw, 66px); }
.section-heading p { margin: 0; }
.intro-copy > p { margin: 0; color: var(--ink-soft); font-size: 19px; line-height: 1.8; }
.arrow-link { display: inline-flex; align-items: center; gap: 16px; margin-top: 32px; color: var(--green-700); font-size: 14px; font-weight: 700; }
.arrow-link span { transition: transform .25s; }.arrow-link:hover span { transform: translateX(5px); }
.capability-rail { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 90px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.capability-rail article { position: relative; min-height: 320px; padding: 42px; border-right: 1px solid var(--line); transition: background .3s, transform .3s; }
.capability-rail article:first-child { border-left: 1px solid var(--line); }
.capability-rail article:hover { z-index: 2; background: var(--white); box-shadow: var(--shadow); transform: translateY(-8px); }
.capability-rail article > span { position: absolute; top: 28px; right: 30px; color: #90a097; font-size: 11px; }
.capability-rail svg { width: 54px; height: 54px; fill: none; stroke: var(--green-600); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; }
.capability-rail h3 { margin: 50px 0 14px; font-family: "Manrope"; font-size: 21px; line-height: 1.2; }
.capability-rail p { margin: 0; color: var(--ink-soft); font-size: 14px; }

.technology-section { background: #eef3ed; }
.heading-split { display: grid; grid-template-columns: 1.2fr .65fr; gap: 100px; align-items: end; }
.heading-split > p { max-width: 450px; color: var(--ink-soft); font-size: 16px; }
.technology-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 70px; }
.technology-card { position: relative; min-height: 650px; padding: 42px; overflow: hidden; border-radius: var(--radius); }
.technology-card-dark { color: var(--white); background: linear-gradient(145deg, #082e21, #0b4b32); }
.technology-card-light { border: 1px solid var(--line); background: var(--white); }
.tech-number { position: absolute; z-index: 3; top: 30px; right: 34px; font-family: "Manrope"; font-size: 12px; font-weight: 800; opacity: .55; }
.tech-graphic { position: relative; height: 260px; margin: -10px 0 20px; }
.solvent-graphic { display: flex; align-items: center; justify-content: center; }
.solvent-graphic span { position: absolute; width: 138px; height: 138px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; }
.solvent-graphic span:nth-child(1) { transform: translateX(-72px); }.solvent-graphic span:nth-child(2) { transform: translateX(72px); }.solvent-graphic span:nth-child(3) { border-color: var(--lime); transform: translateY(-48px); }
.solvent-graphic i { width: 90px; height: 125px; border-radius: 65% 35% 65% 35% / 70% 45% 55% 30%; background: linear-gradient(140deg, var(--lime-light), #45a66d); box-shadow: 0 20px 50px rgba(164,216,78,.2); transform: rotate(45deg); }
.nano-graphic { display: grid; place-items: center; }
.nano-graphic i { width: 82px; height: 82px; border: 1px solid var(--green-600); border-radius: 50%; background: radial-gradient(circle at 35% 30%, var(--lime-light), var(--green-500)); box-shadow: 0 0 0 25px rgba(44,147,92,.06), 0 0 0 55px rgba(44,147,92,.035); }
.nano-graphic span { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: var(--green-500); box-shadow: 0 5px 18px rgba(15,93,60,.2); }
.nano-graphic span:nth-child(1) { top: 37px; left: 28%; }.nano-graphic span:nth-child(2) { top: 68px; right: 23%; width: 24px; height: 24px; }.nano-graphic span:nth-child(3) { right: 30%; bottom: 31px; width: 12px; height: 12px; }.nano-graphic span:nth-child(4) { bottom: 47px; left: 25%; width: 21px; height: 21px; }.nano-graphic span:nth-child(5) { top: 33%; left: 16%; width: 9px; height: 9px; }
.card-kicker { margin: 0 0 14px; color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.technology-card-light .card-kicker { color: var(--green-600); }
.tech-copy h3 { max-width: 440px; margin: 0 0 18px; font-family: "Manrope"; font-size: 34px; line-height: 1.15; letter-spacing: -.035em; }
.tech-copy > p { margin: 0; color: rgba(255,255,255,.65); font-size: 15px; }
.technology-card-light .tech-copy > p { color: var(--ink-soft); }
.tech-copy ul { display: grid; gap: 11px; margin: 28px 0 0; padding: 22px 0 0; border-top: 1px solid rgba(255,255,255,.12); list-style: none; }
.technology-card-light .tech-copy ul { border-color: var(--line); }
.tech-copy li { position: relative; padding-left: 20px; font-size: 13px; }
.tech-copy li::before { position: absolute; top: .65em; left: 0; width: 7px; height: 7px; content: ""; border-radius: 50%; background: var(--lime); }
.compliance-note { max-width: 820px; margin: 28px auto 0; color: #738078; font-size: 11px; text-align: center; }

.products-section { background: var(--white); }
.product-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 55px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.product-toolbar button { padding: 10px 17px; color: var(--ink-soft); border: 1px solid var(--line); border-radius: 999px; background: transparent; font-size: 12px; font-weight: 700; cursor: pointer; transition: all .25s; }
.product-toolbar button:hover, .product-toolbar button.is-active { color: var(--white); border-color: var(--green-700); background: var(--green-700); }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 35px; }
.product-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--white); transition: transform .3s, box-shadow .3s; }
.product-card:hover { box-shadow: 0 22px 60px rgba(5,33,23,.12); transform: translateY(-7px); }
.product-visual { position: relative; display: grid; place-items: center; height: 300px; overflow: hidden; background: linear-gradient(145deg, var(--product-a), var(--product-b)); }
.product-visual::before { position: absolute; top: -80px; right: -90px; width: 260px; height: 260px; content: ""; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; box-shadow: 0 0 0 45px rgba(255,255,255,.04), 0 0 0 90px rgba(255,255,255,.025); }
.tone-emerald { --product-a:#2e7b54;--product-b:#0c3f2c; }.tone-lime { --product-a:#6c8e35;--product-b:#294a26; }.tone-gold { --product-a:#9a792e;--product-b:#4a3b1b; }.tone-forest { --product-a:#467740;--product-b:#173d2b; }.tone-teal { --product-a:#337f78;--product-b:#123d3b; }.tone-copper { --product-a:#a26035;--product-b:#4e2f24; }.tone-ochre { --product-a:#85713d;--product-b:#453a24; }.tone-aqua { --product-a:#3c858a;--product-b:#173f48; }.tone-leaf { --product-a:#6d9639;--product-b:#31502a; }
.pack { position: relative; z-index: 2; width: 106px; height: 158px; border-radius: 12px 12px 18px 18px; background: linear-gradient(100deg, rgba(255,255,255,.9), #e8eee5 50%, #c6d1c6); box-shadow: 0 26px 45px rgba(0,0,0,.22); transform: rotate(-2deg); transition: transform .35s; }
.product-card:hover .pack { transform: translateY(-5px) rotate(2deg); }
.pack-cap { position: absolute; top: -24px; left: 25px; width: 56px; height: 29px; border-radius: 7px 7px 3px 3px; background: linear-gradient(90deg, #d9dfd6, #fff, #c5ccc2); }
.pack-cap::before { position: absolute; inset: 6px 0 auto; height: 2px; content: ""; background: rgba(15,60,40,.12); box-shadow: 0 5px rgba(15,60,40,.12), 0 10px rgba(15,60,40,.12); }
.pack-label { position: absolute; inset: 42px 10px 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 8px; color: var(--white); border-radius: 8px; background: linear-gradient(145deg, var(--product-a), var(--product-b)); text-align: center; }
.pack-label span { font-size: 7px; font-weight: 800; letter-spacing: .16em; }.pack-label strong { margin: 8px 0 3px; font-family: "Manrope"; font-size: 16px; }.pack-label small { font-size: 6px; letter-spacing: .08em; opacity: .65; }
.product-code { position: absolute; right: 16px; bottom: 14px; color: rgba(255,255,255,.6); font-size: 9px; letter-spacing: .08em; }
.product-info { padding: 25px; }
.product-meta { display: flex; justify-content: space-between; gap: 15px; color: var(--green-600); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.product-info h3 { min-height: 54px; margin: 14px 0 20px; font-family: "Manrope", "Microsoft YaHei"; font-size: 20px; line-height: 1.3; letter-spacing: -.02em; }
.product-info dl { display: grid; gap: 11px; margin: 0; padding: 17px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.product-info dl div { display: grid; grid-template-columns: 62px 1fr; gap: 10px; }
.product-info dt { color: #839087; font-size: 10px; text-transform: uppercase; }.product-info dd { margin: 0; color: var(--ink-soft); font-size: 12px; }
.product-info > a { display: flex; justify-content: space-between; margin-top: 18px; color: var(--green-700); font-size: 12px; font-weight: 700; }.product-info > a span { font-size: 17px; transition: transform .2s; }.product-info > a:hover span { transform: translate(3px,-3px); }
.product-disclaimer { display: flex; align-items: flex-start; gap: 14px; max-width: 900px; margin: 35px auto 0; padding: 18px 22px; color: var(--ink-soft); border-radius: 12px; background: #f3f6f2; font-size: 11px; }
.product-disclaimer span { display: grid; flex: 0 0 20px; place-items: center; width: 20px; height: 20px; color: var(--white); border-radius: 50%; background: var(--green-600); font-size: 11px; font-weight: 700; }.product-disclaimer p { margin: 0; }

.application-section { position: relative; padding: 110px 0; overflow: hidden; background: linear-gradient(125deg, #071f17, #0c3d2a); }
.application-section::before { position: absolute; right: -180px; bottom: -300px; width: 700px; height: 700px; content: ""; border: 1px solid rgba(164,216,78,.12); border-radius: 50%; box-shadow: 0 0 0 110px rgba(164,216,78,.02), 0 0 0 220px rgba(164,216,78,.015); }
.application-layout { position: relative; display: grid; grid-template-columns: .85fr 1.15fr; gap: 100px; }
.application-heading h2 { max-width: 520px; }
.application-list { border-top: 1px solid rgba(255,255,255,.12); }
.application-list > div, .application-list > a { display: grid; grid-template-columns: 42px 1fr 1.2fr; align-items: center; gap: 20px; padding: 24px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.application-list > a { transition: padding-left .25s, background .25s; }
.application-list > a:hover { padding-left: 12px; background: rgba(255,255,255,.025); }
.application-list span { color: var(--lime); font-size: 10px; }.application-list h3 { margin: 0; font-family: "Manrope"; font-size: 18px; }.application-list p { margin: 0; color: rgba(255,255,255,.55); font-size: 13px; }

.manufacturing-section { background: var(--sand); }
.process-shell { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 85px; }
.process-line { position: absolute; top: 23px; right: 10%; left: 10%; height: 1px; background: #b9c7bd; }
.process-line::after { position: absolute; inset: -1px auto auto 0; width: 35%; height: 3px; content: ""; background: var(--green-600); }
.process-step { position: relative; padding: 0 22px 25px 0; }
.process-step > span { position: relative; z-index: 2; display: grid; place-items: center; width: 46px; height: 46px; color: var(--white); border: 7px solid var(--sand); border-radius: 50%; background: var(--green-700); font-family: "Manrope"; font-size: 10px; box-shadow: 0 0 0 1px #b9c7bd; }
.process-step h3 { margin: 30px 0 12px; font-family: "Manrope"; font-size: 17px; }.process-step p { margin: 0; color: var(--ink-soft); font-size: 12px; }
.manufacturing-callout { display: grid; grid-template-columns: .45fr 1fr; gap: 60px; align-items: center; margin-top: 60px; padding: 42px 50px; color: var(--white); border-radius: var(--radius); background: var(--green-800); }
.manufacturing-callout > div { display: flex; flex-direction: column; }.manufacturing-callout strong { color: var(--lime); font-family: "Manrope"; font-size: 40px; line-height: 1; }.manufacturing-callout span { margin-top: 8px; color: rgba(255,255,255,.5); font-size: 10px; }.manufacturing-callout p { margin: 0; color: rgba(255,255,255,.75); font-size: 15px; }

.credentials-section { background: var(--white); }
.credentials-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; align-items: center; }
.credentials-visual { position: relative; min-height: 600px; }
.credentials-image-window { position: absolute; inset: 0 35px 0 0; overflow: hidden; border-radius: var(--radius); background: #f4f5ef; box-shadow: var(--shadow); }
.credentials-image-window img { width: 200%; max-width: none; height: 100%; object-fit: cover; object-position: right center; transform: translateX(-50%); }
.credentials-stamp { position: absolute; right: 0; bottom: 45px; display: flex; flex-direction: column; justify-content: center; width: 155px; height: 155px; padding: 25px; color: var(--white); border-radius: 50%; background: var(--green-700); box-shadow: 0 20px 50px rgba(5,33,23,.25); }
.credentials-stamp span { color: var(--lime); font-family: "Manrope"; font-size: 35px; font-weight: 800; line-height: 1; }.credentials-stamp small { margin-top: 8px; font-size: 10px; line-height: 1.35; }
.credentials-copy h2 { margin: 0; font-family: "Manrope", "Microsoft YaHei"; font-size: clamp(40px, 5vw, 62px); line-height: 1.05; letter-spacing: -.05em; }
.credentials-copy > p { margin: 28px 0 0; color: var(--ink-soft); font-size: 16px; }
.credential-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }.credential-tags span { padding: 10px 15px; color: var(--green-700); border: 1px solid rgba(15,93,60,.22); border-radius: 999px; background: #f5f9f5; font-size: 11px; font-weight: 700; }
.credentials-copy .source-note { padding-top: 22px; border-top: 1px solid var(--line); font-size: 11px; }

.contact-section { position: relative; padding: 130px 0 110px; overflow: hidden; background: linear-gradient(135deg, #061f17, #0b3928); }
.contact-orbit { position: absolute; top: -310px; left: -220px; width: 720px; height: 720px; border: 1px solid rgba(164,216,78,.12); border-radius: 50%; box-shadow: 0 0 0 110px rgba(164,216,78,.02), 0 0 0 220px rgba(164,216,78,.012); }
.contact-layout { position: relative; display: grid; grid-template-columns: .85fr 1.15fr; gap: 110px; align-items: start; }
.contact-copy h2 { color: var(--white); }
.contact-copy > p { max-width: 500px; margin: 26px 0 0; color: rgba(255,255,255,.62); font-size: 16px; }
.contact-details { display: grid; gap: 22px; margin-top: 50px; }.contact-details a, .contact-details > div { display: flex; flex-direction: column; gap: 6px; }.contact-details small { color: var(--lime); font-size: 9px; letter-spacing: .14em; }.contact-details strong { color: var(--white); font-size: 14px; font-weight: 600; }
.contact-form-wrap { padding: 42px; color: var(--ink); border-radius: var(--radius); background: var(--white); box-shadow: 0 35px 90px rgba(0,0,0,.25); }
.contact-form-wrap form { display: grid; gap: 20px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.contact-form-wrap label { display: grid; gap: 8px; color: var(--ink); font-size: 11px; font-weight: 700; }
.contact-form-wrap input, .contact-form-wrap select, .contact-form-wrap textarea { width: 100%; color: var(--ink); border: 0; border-bottom: 1px solid #cbd5ce; border-radius: 0; outline: none; background: transparent; font-size: 14px; font-weight: 400; transition: border-color .2s; }
.contact-form-wrap input, .contact-form-wrap select { height: 46px; }.contact-form-wrap textarea { padding: 11px 0; resize: vertical; }
.contact-form-wrap input:focus, .contact-form-wrap select:focus, .contact-form-wrap textarea:focus { border-color: var(--green-600); }
.contact-form-wrap input::placeholder, .contact-form-wrap textarea::placeholder { color: #9aa59e; }
.button-submit { width: 100%; margin-top: 4px; border-radius: 8px; }.button-submit span { margin-left: 10px; font-size: 19px; }
.privacy-copy { margin: -7px 0 0; color: #87928b; font-size: 9px; text-align: center; }
.honeypot { position: absolute !important; left: -9999px !important; }
.form-notice { margin-bottom: 20px; padding: 13px 15px; border-radius: 8px; font-size: 12px; }.form-notice.is-success { color: #175f3d; background: #eaf6ed; }.form-notice.is-error { color: #8d3c32; background: #faece9; }

.site-footer { padding: 75px 0 25px; color: rgba(255,255,255,.62); background: #041711; }
.footer-grid { display: grid; grid-template-columns: 1.3fr .6fr 1fr; gap: 90px; padding-bottom: 55px; }
.brand-light { color: var(--white); }.footer-grid > div:first-child p { max-width: 400px; margin: 24px 0 0; font-size: 13px; }
.footer-grid h3 { margin: 0 0 18px; color: var(--white); font-family: "Manrope"; font-size: 12px; letter-spacing: .05em; }.footer-grid > div:not(:first-child) { display: flex; flex-direction: column; gap: 10px; }.footer-grid a, .footer-grid span { font-size: 12px; }.footer-grid a:hover { color: var(--lime); }
.footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); font-size: 9px; }
.basic-page { min-height: 70vh; padding-top: 150px; padding-bottom: 100px; }

/* Multi-page architecture */
.subpage { background: var(--paper); }
.page-hero { position: relative; min-height: 580px; padding: 155px 0 100px; overflow: hidden; background: radial-gradient(circle at 85% 35%, rgba(36,120,75,.38), transparent 27%), linear-gradient(130deg,#061e16,#0a3525); }
.page-hero::after { position: absolute; right: -160px; bottom: -420px; width: 850px; height: 850px; content: ""; border: 1px solid rgba(164,216,78,.13); border-radius: 50%; box-shadow: 0 0 0 115px rgba(164,216,78,.02), 0 0 0 230px rgba(164,216,78,.012); }
.page-hero-grid { position: absolute; inset: 0; opacity: .1; background-image: linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px); background-size: 72px 72px; -webkit-mask-image: linear-gradient(to right,transparent,#000); mask-image: linear-gradient(to right,transparent,#000); }
.page-hero-inner { position: relative; z-index: 2; max-width: 1050px; margin-top: 38px; }
.breadcrumbs { display: flex; align-items: center; gap: 9px; margin-bottom: 58px; color: rgba(255,255,255,.45); font-size: 10px; }
.breadcrumbs a:hover { color: var(--lime); }
.page-hero h1 { max-width: 970px; margin: 0; font-family: "Manrope","Microsoft YaHei",sans-serif; font-size: clamp(48px,6vw,78px); font-weight: 700; letter-spacing: -.055em; line-height: 1.04; }
.page-hero-inner > p:last-child { max-width: 720px; margin: 28px 0 0; color: rgba(255,255,255,.65); font-size: 18px; }
.profile-layout { display: grid; grid-template-columns: 1fr .85fr; gap: 110px; align-items: start; }
.long-copy { color: var(--ink-soft); font-size: 17px; line-height: 1.85; }
.long-copy p:first-child { margin-top: 0; }.long-copy p:last-child { margin-bottom: 0; }
.about-metrics { background: var(--white); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.about-metrics .trust-grid strong { font-size: 32px; }.about-metrics .trust-grid strong sup { font-size: 11px; }
.value-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 65px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.value-grid article { min-height: 280px; padding: 34px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.45); }
.value-grid article > span, .application-card > span, .qualification-grid article > span, .product-document-grid article > span { color: var(--green-600); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.value-grid h3 { margin: 75px 0 12px; font-family: "Manrope"; font-size: 20px; line-height: 1.25; }.value-grid p { margin: 0; color: var(--ink-soft); font-size: 13px; }
.cooperation-panel { display: grid; grid-template-columns: 1fr .85fr; gap: 100px; padding: 65px; border-radius: var(--radius); background: var(--white); box-shadow: var(--shadow); }
.cooperation-panel h2 { margin: 0; font-family: "Manrope","Microsoft YaHei"; font-size: clamp(38px,4.5vw,58px); letter-spacing: -.05em; line-height: 1.05; }
.home-section-preview { padding-block: 115px; }
.home-link-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 60px; }
.home-link-grid a { position: relative; min-height: 280px; padding: 38px; overflow: hidden; border-radius: var(--radius); background: var(--white); box-shadow: 0 18px 55px rgba(5,33,23,.07); transition: transform .3s,box-shadow .3s; }
.home-link-grid a:first-child { color: var(--white); background: var(--green-800); }
.home-link-grid a:hover { box-shadow: var(--shadow); transform: translateY(-6px); }.home-link-grid span { color: var(--lime); font-size: 10px; }.home-link-grid h3 { max-width: 470px; margin: 58px 0 12px; font-family: "Manrope"; font-size: 28px; line-height: 1.2; }.home-link-grid p { max-width: 450px; margin: 0; color: var(--ink-soft); font-size: 14px; }.home-link-grid a:first-child p { color: rgba(255,255,255,.6); }.home-link-grid b { position: absolute; right: 32px; bottom: 28px; color: var(--green-600); font-size: 25px; }.home-link-grid a:first-child b { color: var(--lime); }
.home-products { padding-block: 115px; }.home-product-grid { margin-top: 60px; }.center-action { display: flex; justify-content: center; margin-top: 42px; }
.home-cta { padding: 85px 0; background: var(--lime); }
.home-cta > .container { display: flex; align-items: flex-end; justify-content: space-between; gap: 50px; }
.home-cta .eyebrow { margin-bottom: 16px; }.home-cta h2 { max-width: 850px; margin: 0; color: var(--green-950); font-family: "Manrope","Microsoft YaHei"; font-size: clamp(34px,4vw,55px); line-height: 1.06; letter-spacing: -.05em; }
.home-cta .button { flex: 0 0 auto; color: var(--white); background: var(--green-900); border-color: var(--green-900); }.home-cta .button:hover { color: var(--green-900); background: var(--white); border-color: var(--white); }
.technology-grid-detail .technology-card { min-height: 720px; }.technology-grid-detail .tech-copy h2 { max-width: 450px; margin: 0 0 18px; font-family: "Manrope","Microsoft YaHei"; font-size: 36px; line-height: 1.13; letter-spacing: -.04em; }
.evidence-panel { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 75px; color: var(--white); border-radius: var(--radius); background: var(--green-800); }
.evidence-panel > div { display: flex; flex-direction: column; min-height: 170px; padding: 38px; border-right: 1px solid rgba(255,255,255,.12); }.evidence-panel > div:last-child { border-right: 0; }.evidence-panel strong { color: var(--lime); font-family: "Manrope"; font-size: 38px; line-height: 1; }.evidence-panel span { margin-top: 14px; color: rgba(255,255,255,.6); font-size: 11px; }
.application-card-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 24px; }
.application-card { min-height: 520px; padding: 42px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.application-icon { display: grid; place-items: center; width: 100px; height: 100px; margin: 45px 0 32px; border-radius: 50%; background: #edf4ec; font-size: 42px; }.application-card h2 { margin: 0; font-family: "Manrope"; font-size: 32px; letter-spacing: -.035em; }.application-card p { color: var(--ink-soft); }.application-card ul { display: grid; gap: 9px; margin: 25px 0 0; padding: 20px 0 0; border-top: 1px solid var(--line); list-style: none; }.application-card li { position: relative; padding-left: 18px; color: var(--ink-soft); font-size: 12px; }.application-card li::before { position: absolute; top: .65em; left: 0; width: 6px; height: 6px; content: ""; border-radius: 50%; background: var(--green-500); }
.solution-steps { display: grid; gap: 0; border-top: 1px solid var(--line); }.solution-steps > div { display: grid; grid-template-columns: 45px 1fr; padding: 20px 0; border-bottom: 1px solid var(--line); }.solution-steps span { color: var(--green-600); font-size: 10px; }.solution-steps b { font-size: 14px; }.solution-steps .button { justify-self: start; margin-top: 30px; }
.workflow-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 65px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line); }
.workflow-grid article { display: grid; grid-template-columns: 58px 1fr; gap: 22px; min-height: 150px; padding: 30px; background: var(--white); }.workflow-grid article > span { display: grid; place-items: center; width: 46px; height: 46px; color: var(--white); border-radius: 50%; background: var(--green-700); font-family: "Manrope"; font-size: 10px; }.workflow-grid h3 { margin: 2px 0 7px; font-family: "Manrope"; font-size: 17px; }.workflow-grid p { margin: 0; color: var(--ink-soft); font-size: 12px; }
.facility-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; margin-top: 60px; }.facility-grid article { min-height: 280px; padding: 38px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }.facility-grid strong { color: var(--green-700); font-family: "Manrope"; font-size: 38px; }.facility-grid strong sup { font-size: 13px; }.facility-grid h3 { margin: 60px 0 10px; font-family: "Manrope"; font-size: 20px; }.facility-grid p { margin: 0; color: var(--ink-soft); font-size: 13px; }
.quality-band { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; margin-top: 24px; padding: 55px; color: var(--white); border-radius: var(--radius); background: var(--green-800); }.quality-band h2 { margin: 0; font-family: "Manrope"; font-size: 34px; line-height: 1.15; }.quality-band ul { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }.quality-band li { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.7); font-size: 13px; }
.qualification-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }.qualification-grid article { min-height: 400px; padding: 38px; border-radius: var(--radius); background: var(--white); }.qualification-grid h2 { margin: 75px 0 25px; font-family: "Manrope"; font-size: 25px; line-height: 1.2; }.qualification-grid ul { display: grid; gap: 13px; margin: 0; padding: 20px 0 0; border-top: 1px solid var(--line); list-style: none; }.qualification-grid li { color: var(--ink-soft); font-size: 12px; }
.contact-page-section { background: var(--sand); }.contact-page-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 95px; align-items: start; }.contact-business h2 { margin: 0; font-family: "Manrope","Microsoft YaHei"; font-size: clamp(40px,4.6vw,60px); line-height: 1.05; letter-spacing: -.05em; }.contact-business > p { color: var(--ink-soft); }.contact-info-cards { display: grid; gap: 1px; margin-top: 45px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--line); }.contact-info-cards > * { display: flex; flex-direction: column; gap: 5px; padding: 20px; background: var(--white); }.contact-info-cards small { color: var(--green-600); font-size: 9px; letter-spacing: .12em; }.contact-info-cards strong { font-size: 13px; font-weight: 600; }.contact-form-light { box-shadow: var(--shadow); }.contact-next { padding: 65px 0; }.contact-next .container { display: grid; grid-template-columns: repeat(3,1fr); }.contact-next .container > div { padding: 15px 35px; border-right: 1px solid rgba(255,255,255,.12); }.contact-next .container > div:first-child { padding-left: 0; }.contact-next span { color: var(--lime); font-size: 10px; }.contact-next h3 { margin: 20px 0 8px; font-family: "Manrope"; font-size: 20px; }.contact-next p { margin: 0; color: rgba(255,255,255,.55); font-size: 12px; }
.product-archive-section { padding-top: 90px; }.product-archive-section .product-toolbar { margin-top: 0; }
.product-detail-hero { position: relative; padding: 150px 0 100px; overflow: hidden; background: linear-gradient(130deg,#061e16,#0a3525); }.product-detail-layout { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr .85fr; gap: 90px; align-items: center; min-height: 520px; }.product-detail-copy h1 { margin: 0; font-family: "Manrope","Microsoft YaHei"; font-size: clamp(48px,5.8vw,78px); line-height: 1.03; letter-spacing: -.055em; }.product-detail-copy > p { max-width: 680px; margin: 28px 0; color: rgba(255,255,255,.63); font-size: 16px; }.detail-pack-visual { position: relative; display: grid; place-items: center; min-height: 480px; overflow: hidden; border-radius: 32px; background: linear-gradient(145deg,var(--product-a),var(--product-b)); box-shadow: 0 40px 90px rgba(0,0,0,.25); }.detail-pack-visual::before { position: absolute; width: 420px; height: 420px; content: ""; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; box-shadow: 0 0 0 65px rgba(255,255,255,.035); }.pack-large { width: 155px; height: 235px; border-radius: 18px 18px 25px 25px; }.pack-large .pack-cap { top: -34px; left: 36px; width: 82px; height: 42px; }.pack-large .pack-label { inset: 60px 14px 24px; }.pack-large .pack-label strong { font-size: 24px; }.detail-reg { position: absolute; right: 25px; bottom: 22px; color: rgba(255,255,255,.6); font-size: 10px; letter-spacing: .08em; }.product-spec-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 95px; }.spec-table { border-top: 1px solid var(--line); }.spec-table > div { display: grid; grid-template-columns: 180px 1fr; gap: 25px; padding: 20px 0; border-bottom: 1px solid var(--line); }.spec-table span { color: var(--ink-soft); font-size: 11px; }.spec-table strong { font-size: 14px; }.product-document-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }.product-document-grid article { min-height: 300px; padding: 35px; border-radius: var(--radius); background: var(--white); }.product-document-grid h2 { margin: 75px 0 15px; font-family: "Manrope"; font-size: 24px; line-height: 1.2; }.product-document-grid p { margin: 0; color: var(--ink-soft); font-size: 13px; }.related-grid { margin-top: 60px; }

@media (max-width: 1100px) {
	.desktop-nav { gap: 18px; }
	.header-actions .button-small { display: none; }
	.hero-layout { gap: 20px; }
	.science-card { right: 0; width: 390px; }
	.intro-layout, .heading-split { gap: 60px; }
	.product-grid { grid-template-columns: repeat(2, 1fr); }
	.credentials-layout, .contact-layout { gap: 60px; }
}

@media (max-width: 860px) {
	:root { --radius: 18px; }
	.container { width: min(calc(100% - 34px), var(--container)); }
	.section { padding: 90px 0; }
	.desktop-nav { display: none; }
	.menu-toggle { display: block; }
	.site-header { color: var(--white); background: rgba(6,31,23,.65); backdrop-filter: blur(12px); }
	.site-header.is-scrolled { color: var(--ink); }
	.mobile-nav { position: fixed; top: 81px; right: 0; left: 0; display: flex; flex-direction: column; gap: 4px; height: calc(100vh - 81px); padding: 35px 24px; color: var(--ink); background: var(--paper); transform: translateX(100%); transition: transform .3s ease; }
	.mobile-nav[aria-hidden="false"] { transform: translateX(0); }
	.mobile-nav a { padding: 16px 4px; border-bottom: 1px solid var(--line); font-family: "Manrope"; font-size: 22px; font-weight: 700; }
	.hero { min-height: auto; padding-top: 130px; }
	.hero-layout { grid-template-columns: 1fr; }
	.hero-copy { max-width: 720px; }
	.hero-visual { min-height: 520px; margin-top: 35px; }
	.science-card { right: 50%; width: min(430px, 88vw); transform: translateX(50%) rotate(1deg); }
	.hero-badge { right: 7%; }
	.trust-grid { grid-template-columns: repeat(2, 1fr); }
	.trust-grid > div:nth-child(3) { border-left: 1px solid var(--line); }
	.intro-layout, .heading-split, .application-layout, .credentials-layout, .contact-layout { grid-template-columns: 1fr; gap: 45px; }
	.capability-rail { grid-template-columns: 1fr; }
	.capability-rail article, .capability-rail article:first-child { min-height: auto; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); }
	.technology-grid { grid-template-columns: 1fr; }
	.application-list > div, .application-list > a { grid-template-columns: 42px 1fr; }.application-list p { grid-column: 2; }
	.process-shell { grid-template-columns: 1fr; gap: 0; margin-top: 55px; }.process-line { top: 0; bottom: 0; left: 22px; width: 1px; height: auto; }.process-line::after { width: 3px; height: 35%; }.process-step { display: grid; grid-template-columns: 52px 1fr; column-gap: 20px; padding: 0 0 30px; }.process-step > span { grid-row: 1 / span 2; }.process-step h3 { margin: 4px 0 6px; }.process-step p { grid-column: 2; }
	.manufacturing-callout { grid-template-columns: 1fr; gap: 25px; }
	.credentials-visual { min-height: 520px; }
	.footer-grid { grid-template-columns: 1fr 1fr; }.footer-grid > div:first-child { grid-column: 1 / -1; }
	.page-hero { min-height: 500px; padding-top: 125px; }.page-hero-inner { margin-top: 10px; }.breadcrumbs { margin-bottom: 42px; }
	.profile-layout, .cooperation-panel, .contact-page-grid, .product-detail-layout, .product-spec-layout { grid-template-columns: 1fr; gap: 45px; }
	.value-grid, .facility-grid, .qualification-grid, .product-document-grid { grid-template-columns: repeat(2,1fr); }
	.home-cta > .container { align-items: flex-start; flex-direction: column; }
	.application-card-grid { grid-template-columns: 1fr; }
	.workflow-grid { grid-template-columns: 1fr; }
	.quality-band { grid-template-columns: 1fr; gap: 35px; }
	.contact-next .container { grid-template-columns: 1fr; }.contact-next .container > div,.contact-next .container > div:first-child { padding: 25px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
	.product-detail-layout { padding-top: 25px; }.detail-pack-visual { min-height: 440px; }.evidence-panel { grid-template-columns: 1fr; }.evidence-panel > div { min-height: 130px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
}

@media (max-width: 580px) {
	.container { width: min(calc(100% - 28px), var(--container)); }
	.header-inner { min-height: 72px; gap: 10px; }.brand-mark { width: 38px; height: 38px; }.brand-copy strong { font-size: 17px; }.brand-copy small { font-size: 6px; }.language-toggle { font-size: 10px; }.mobile-nav { top: 71px; height: calc(100vh - 71px); }
	.hero { padding-top: 115px; }.hero h1 { font-size: clamp(44px, 13vw, 64px); }.hero-lead { font-size: 16px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 20px; }.hero-proof { align-items: flex-start; }
	.hero-visual { min-height: 430px; }.science-card { min-height: 410px; padding: 20px; }.drop-visual { height: 260px; transform: scale(.82); }.hero-badge { right: 0; bottom: 0; width: 118px; height: 118px; padding: 18px; }.hero-badge strong { font-size: 26px; }
	.trust-grid > div { min-height: 120px; padding: 22px 18px; }.trust-grid strong { font-size: 29px; }.trust-grid span { font-size: 10px; }
	.section-heading h2, .application-heading h2, .contact-copy h2, .credentials-copy h2 { font-size: 39px; }
	.intro-copy > p { font-size: 16px; }
	.capability-rail { margin-top: 55px; }.capability-rail article { padding: 32px; }.capability-rail h3 { margin-top: 35px; }
	.technology-card { min-height: auto; padding: 28px 24px 32px; }.tech-graphic { height: 220px; }.tech-copy h3 { font-size: 29px; }
	.product-grid { grid-template-columns: 1fr; }.product-visual { height: 270px; }.product-info h3 { min-height: 0; }
	.application-section { padding: 85px 0; }.application-list > div { gap: 12px; }.application-list h3 { font-size: 16px; }
	.manufacturing-callout { padding: 30px 25px; }.manufacturing-callout strong { font-size: 33px; }
	.credentials-visual { min-height: 420px; }.credentials-image-window { right: 20px; }.credentials-stamp { width: 125px; height: 125px; padding: 20px; }.credentials-stamp span { font-size: 28px; }
	.contact-form-wrap { padding: 28px 20px; }.form-row { grid-template-columns: 1fr; }
	.footer-grid { grid-template-columns: 1fr; gap: 35px; }.footer-grid > div:first-child { grid-column: auto; }.footer-bottom { flex-direction: column; }
	.page-hero h1 { font-size: 44px; }.page-hero-inner > p:last-child { font-size: 15px; }.page-hero { min-height: 480px; }
	.value-grid, .facility-grid, .qualification-grid, .product-document-grid, .home-link-grid { grid-template-columns: 1fr; }
	.cooperation-panel { padding: 32px 24px; }.cooperation-panel h2 { font-size: 37px; }
	.home-cta { padding: 65px 0; }.home-cta h2 { font-size: 36px; }
	.application-card { min-height: auto; padding: 30px 24px; }.application-card h2 { font-size: 28px; }
	.workflow-grid article { grid-template-columns: 48px 1fr; padding: 23px 18px; }.workflow-grid article > span { width: 40px; height: 40px; }
	.quality-band { padding: 32px 24px; }.quality-band h2 { font-size: 28px; }
	.contact-business h2 { font-size: 40px; }.product-detail-hero { padding-top: 120px; }.product-detail-copy h1 { font-size: 45px; }.detail-pack-visual { min-height: 380px; }
	.spec-table > div { grid-template-columns: 1fr; gap: 6px; }.product-document-grid h2,.qualification-grid h2 { margin-top: 45px; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
	.js .reveal { opacity: 1; transform: none; }
}

/* ================================================================
   FIELDLAB ARCHIVE / 2.0
   An agricultural-science visual system built from specimen labels,
   laboratory grids and field coordinates.
   ================================================================ */
:root {
	--ink: #151710;
	--ink-soft: #55584d;
	--green-950: #11130e;
	--green-900: #171a12;
	--green-800: #22271a;
	--green-700: #3047ff;
	--green-600: #3047ff;
	--green-500: #5468ff;
	--lime: #d9ff43;
	--lime-light: #eaff8e;
	--aqua: #aeb9ff;
	--sand: #ebe7da;
	--paper: #f3f0e5;
	--white: #fffdf4;
	--line: rgba(21,23,16,.28);
	--shadow: 9px 9px 0 #151710;
	--radius: 0px;
	--container: 1280px;
}

html { scroll-padding-top: 88px; }
body {
	position: relative;
	color: var(--ink);
	background-color: var(--paper);
	background-image: radial-gradient(rgba(21,23,16,.13) .7px, transparent .7px);
	background-size: 7px 7px;
	font-family: "Space Grotesk", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}
body::before {
	position: fixed;
	z-index: 900;
	top: 50%;
	left: 7px;
	content: "TF — 38°N / 116°E — FIELD LAB";
	color: rgba(21,23,16,.56);
	font-size: 8px;
	font-weight: 700;
	letter-spacing: .19em;
	pointer-events: none;
	transform: translateY(-50%) rotate(-90deg);
}
::selection { color: var(--ink); background: var(--lime); }
.container { width: min(calc(100% - 76px), var(--container)); }
.section { padding: 118px 0; }
.section-dark { color: var(--white); background: var(--ink); }
.js .reveal { transform: translateY(18px); transition-duration: .55s; }

.site-header {
	color: var(--white);
	border-bottom: 2px solid var(--lime);
	background: var(--ink);
	transition: none;
}
.site-header.is-scrolled { color: var(--white); background: rgba(21,23,16,.97); box-shadow: none; backdrop-filter: blur(12px); }
.header-inner { min-height: 86px; }
.brand { gap: 13px; }
.brand-mark { width: 48px; height: 48px; padding: 4px; border: 1px solid rgba(217,255,67,.55); }
.brand-copy strong { font-family: "Space Grotesk", sans-serif; font-size: 19px; font-weight: 700; letter-spacing: .17em; }
.brand-copy small { color: var(--lime); font-size: 7px; opacity: 1; }
.desktop-nav { gap: 24px; counter-reset: nav; }
.desktop-nav a { display: grid; gap: 1px; font-size: 11px; font-weight: 650; letter-spacing: .03em; }
.desktop-nav a::before { content: "0" counter(nav); color: var(--lime); font-size: 7px; letter-spacing: .12em; counter-increment: nav; }
.desktop-nav a::after { bottom: -10px; height: 3px; background: var(--lime); }
.language-toggle { border: 1px solid rgba(255,255,255,.38); border-radius: 0; }
.button {
	min-height: 50px;
	padding: 0 22px;
	color: var(--ink);
	border: 2px solid var(--ink);
	border-radius: 0;
	background: var(--lime);
	box-shadow: 4px 4px 0 var(--ink);
	font-size: 11px;
	font-weight: 750;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.button:hover, .button:focus-visible { color: var(--white); border-color: var(--ink); background: var(--cobalt, #3047ff); box-shadow: 1px 1px 0 var(--ink); transform: translate(3px,3px); }
.button-small, .is-scrolled .button-small { min-height: 40px; color: var(--ink); border-color: var(--lime); background: var(--lime); box-shadow: none; }

.hero {
	min-height: 900px;
	padding: 166px 0 88px;
	background: var(--ink);
}
.hero-grid {
	opacity: .38;
	background-image: linear-gradient(rgba(255,255,255,.11) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.11) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: none;
	mask-image: none;
}
.hero::before {
	top: 92px;
	left: -80px;
	width: 335px;
	height: 335px;
	border: 36px solid var(--cobalt, #3047ff);
	border-radius: 50%;
	box-shadow: none;
	opacity: .9;
}
.hero::after {
	position: absolute;
	top: 86px;
	right: 32px;
	content: "FORMULA / 001";
	color: var(--lime);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: .22em;
}
.hero-orbit { border-color: rgba(217,255,67,.26); border-radius: 0; transform: rotate(12deg); }
.hero-orbit-one { right: -250px; bottom: -330px; }
.hero-orbit-two { right: 160px; bottom: -210px; }
.hero-layout { grid-template-columns: 1.15fr .85fr; gap: 46px; min-height: 640px; }
.eyebrow { color: var(--lime); font-size: 9px; letter-spacing: .22em; }
.eyebrow > span:first-child { width: 52px; height: 4px; background: var(--lime); }
.eyebrow-green { color: var(--cobalt, #3047ff); }
.eyebrow-green > span:first-child { background: currentColor; }
.hero h1 {
	max-width: 820px;
	font-family: "Instrument Serif", "Noto Sans SC", serif;
	font-size: clamp(76px,8vw,122px);
	font-weight: 400;
	letter-spacing: -.055em;
	line-height: .82;
}
.hero h1 em { color: var(--lime); font-style: italic; font-weight: 400; }
[data-language="zh"] .hero h1, [data-language="zh"] .page-hero h1, [data-language="zh"] .product-detail-copy h1 { font-family: "Noto Sans SC", sans-serif; font-weight: 800; line-height: 1; }
.hero-lead { max-width: 550px; padding-left: 18px; border-left: 2px solid var(--lime); color: rgba(255,255,255,.74); font-size: 15px; }
.button-light { color: var(--ink); border-color: var(--lime); background: var(--lime); box-shadow: 5px 5px 0 var(--cobalt, #3047ff); }
.text-link { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.hero-proof { color: rgba(255,255,255,.65); font-family: monospace; font-size: 10px; text-transform: uppercase; }
.proof-dot, .proof-dot::after { border-radius: 0; }
.science-card {
	top: 16px;
	right: 16px;
	width: min(100%, 448px);
	min-height: 535px;
	padding: 24px;
	border: 2px solid var(--ink);
	border-radius: 0;
	background: var(--lime);
	box-shadow: 13px 13px 0 var(--cobalt, #3047ff);
	backdrop-filter: none;
	transform: rotate(1.5deg);
}
.science-card::before { background: repeating-linear-gradient(90deg, transparent 0 39px, rgba(21,23,16,.11) 40px); }
.science-card-top { color: var(--ink); border-bottom: 2px solid var(--ink); padding-bottom: 13px; }
.science-card-top strong { color: var(--ink); }
.drop-visual { height: 352px; }
.drop-core { width: 134px; height: 174px; background: linear-gradient(140deg,#ffffff,#aeb9ff 45%,#3047ff); box-shadow: inset 17px 17px 28px rgba(255,255,255,.65), 11px 11px 0 rgba(21,23,16,.22); }
.drop-ring { border: 2px solid var(--ink); }
.drop-ring::before { width: 11px; height: 11px; border-radius: 0; background: var(--cobalt, #3047ff); box-shadow: none; }
.science-card-bottom { color: var(--ink); border-top: 2px solid var(--ink); }
.science-card-bottom small { color: rgba(21,23,16,.6); }
.hero-badge {
	right: -8px;
	bottom: 10px;
	width: 138px;
	height: 138px;
	color: var(--white);
	border: 2px solid var(--ink);
	border-radius: 0;
	background: #ff5838;
	box-shadow: 7px 7px 0 var(--ink);
	transform: rotate(-4deg);
}
.hero-badge strong { font-family: "Instrument Serif", serif; font-weight: 400; }
.molecule i { border-color: var(--lime); border-radius: 0; background: var(--cobalt, #3047ff); }
.molecule i::after { background: var(--lime); }
.hero-ticker { border-top: 2px solid var(--lime); background: var(--ink); }
.ticker-track { min-height: 62px; }
.ticker-track span { color: var(--white); font-size: 9px; }
.ticker-track i { border-radius: 0; background: var(--lime); }

.trust-strip { border-block: 2px solid var(--ink); background: var(--lime); }
.trust-grid > div { min-height: 155px; padding: 25px 30px; border-color: var(--ink); }
.trust-grid > div:first-child { border-color: var(--ink); }
.trust-grid > div:nth-child(even) { color: var(--white); background: var(--cobalt, #3047ff); }
.trust-grid strong { color: inherit; font-family: "Instrument Serif", serif; font-size: 52px; font-weight: 400; }
.trust-grid span { color: inherit; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }

.intro-section, .manufacturing-section { background-color: var(--paper); background-image: linear-gradient(rgba(21,23,16,.07) 1px, transparent 1px),linear-gradient(90deg,rgba(21,23,16,.07) 1px,transparent 1px); background-size: 48px 48px; }
.section-heading h2, .application-heading h2, .contact-copy h2, .contact-business h2, .cooperation-panel h2, .home-cta h2 {
	font-family: "Instrument Serif", "Noto Sans SC", serif;
	font-weight: 400;
	letter-spacing: -.04em;
}
.section-heading h2, .application-heading h2, .contact-copy h2 { font-size: clamp(54px,6vw,82px); line-height: .95; }
.intro-copy > p, .long-copy { color: var(--ink); }
.arrow-link { color: var(--cobalt, #3047ff); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.capability-rail { border-width: 2px; border-color: var(--ink); background: var(--white); }
.capability-rail article, .capability-rail article:first-child { border-color: var(--ink); }
.capability-rail article { min-height: 340px; }
.capability-rail article:hover { color: var(--white); background: var(--cobalt, #3047ff); box-shadow: 8px 8px 0 var(--ink); transform: translate(-5px,-5px); }
.capability-rail article > span { color: var(--ink); font-family: monospace; }
.capability-rail article:hover > span, .capability-rail article:hover p { color: rgba(255,255,255,.75); }
.capability-rail svg { stroke: var(--cobalt, #3047ff); stroke-width: 2; }
.capability-rail article:hover svg { stroke: var(--lime); }
.capability-rail h3 { font-family: "Space Grotesk"; font-size: 24px; }

.technology-section { border-block: 2px solid var(--ink); background: var(--lime); }
.technology-grid { gap: 28px; }
.technology-card { min-height: 670px; border: 2px solid var(--ink); border-radius: 0; box-shadow: 9px 9px 0 var(--ink); }
.technology-card-dark { color: var(--white); background: var(--cobalt, #3047ff); }
.technology-card-light { background: var(--white); }
.tech-number { padding: 5px 8px; color: var(--ink); background: var(--lime); opacity: 1; }
.technology-card-light .tech-number { color: var(--white); background: var(--ink); }
.solvent-graphic span { border: 2px solid var(--lime); border-radius: 0; }
.solvent-graphic span:nth-child(3) { border-color: var(--white); }
.solvent-graphic i { border: 2px solid var(--ink); border-radius: 65% 35% 65% 35% / 70% 45% 55% 30%; background: var(--lime); box-shadow: 8px 8px 0 var(--ink); }
.nano-graphic i { border: 2px solid var(--ink); background: var(--cobalt, #3047ff); box-shadow: 0 0 0 25px rgba(48,71,255,.12),0 0 0 55px rgba(48,71,255,.06); }
.nano-graphic span { border: 1px solid var(--ink); border-radius: 0; background: var(--lime); box-shadow: none; }
.card-kicker, .technology-card-light .card-kicker { color: inherit; font-family: monospace; }
.tech-copy h3, .technology-grid-detail .tech-copy h2 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 42px; font-weight: 400; }
.technology-card-light .tech-copy > p { color: var(--ink); }
.compliance-note { color: var(--ink); font-family: monospace; }

.products-section, .home-products, .product-archive-section { background: var(--white); }
.product-toolbar { gap: 0; border-bottom: 2px solid var(--ink); }
.product-toolbar button { margin: 0 -2px -2px 0; padding: 11px 17px; color: var(--ink); border: 2px solid var(--ink); border-radius: 0; background: var(--white); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.product-toolbar button:hover, .product-toolbar button.is-active { color: var(--ink); border-color: var(--ink); background: var(--lime); }
.product-grid { gap: 26px; }
.product-card { border: 2px solid var(--ink); border-radius: 0; box-shadow: 6px 6px 0 var(--ink); }
.product-card:hover { box-shadow: 11px 11px 0 var(--cobalt, #3047ff); transform: translate(-4px,-4px); }
.product-visual { height: 310px; border-bottom: 2px solid var(--ink); background: var(--cobalt, #3047ff); }
.product-visual::before { top: 28px; right: 28px; width: 180px; height: 180px; border: 2px solid var(--lime); border-radius: 0; box-shadow: 28px 28px 0 rgba(217,255,67,.16); transform: rotate(14deg); }
.product-visual::after { position: absolute; top: 15px; left: 16px; content: "SPECIMEN / TF"; color: var(--lime); font-family: monospace; font-size: 9px; letter-spacing: .12em; }
.pack { border: 2px solid var(--ink); border-radius: 2px; box-shadow: 9px 9px 0 rgba(21,23,16,.45); }
.pack-cap { border: 2px solid var(--ink); border-radius: 0; background: var(--white); }
.pack-label { border: 1px solid var(--ink); border-radius: 0; background: var(--lime); color: var(--ink); }
.product-code { color: var(--white); font-family: monospace; }
.product-info { padding: 24px; }
.product-meta { color: var(--cobalt, #3047ff); font-family: monospace; }
.product-info h3 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 26px; font-weight: 400; }
.product-info dl { border-color: var(--ink); }
.product-info > a { color: var(--ink); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.product-disclaimer { border: 1px solid var(--ink); border-radius: 0; background: var(--paper); }
.product-disclaimer span { border-radius: 0; background: var(--cobalt, #3047ff); }

.application-section { border-block: 2px solid var(--ink); background: var(--cobalt, #3047ff); }
.application-section::before { right: -120px; bottom: -120px; width: 520px; height: 520px; border: 35px solid var(--lime); border-radius: 50%; box-shadow: none; opacity: .18; }
.application-list { border-top: 2px solid var(--white); }
.application-list > div, .application-list > a { border-bottom: 1px solid rgba(255,255,255,.55); }
.application-list > a:hover { padding-left: 14px; background: var(--lime); color: var(--ink); }
.application-list > a:hover p { color: var(--ink); }
.application-list span { color: var(--lime); font-family: monospace; }
.application-list h3 { font-size: 20px; }
.application-list p { color: rgba(255,255,255,.75); }

.process-line { height: 2px; background: var(--ink); }
.process-line::after { background: var(--cobalt, #3047ff); }
.process-step > span { color: var(--ink); border: 7px solid var(--paper); border-radius: 0; background: var(--lime); box-shadow: 0 0 0 2px var(--ink); }
.process-step h3 { font-size: 18px; }
.manufacturing-callout, .quality-band, .evidence-panel { border: 2px solid var(--ink); border-radius: 0; background: var(--ink); box-shadow: 9px 9px 0 var(--cobalt, #3047ff); }
.manufacturing-callout strong, .evidence-panel strong { color: var(--lime); font-family: "Instrument Serif", serif; font-weight: 400; }

.credentials-section { background: var(--white); }
.credentials-image-window { border: 2px solid var(--ink); border-radius: 0; box-shadow: 11px 11px 0 var(--cobalt, #3047ff); filter: saturate(.72) contrast(1.05); }
.credentials-stamp { border: 2px solid var(--ink); border-radius: 0; background: var(--lime); box-shadow: 7px 7px 0 var(--ink); color: var(--ink); transform: rotate(-5deg); }
.credentials-stamp span { color: var(--cobalt, #3047ff); font-family: "Instrument Serif", serif; font-weight: 400; }

.contact-section, .contact-page-section { background: var(--paper); }
.contact-form-wrap, .contact-form-light { border: 2px solid var(--ink); border-radius: 0; box-shadow: 9px 9px 0 var(--cobalt, #3047ff); background: var(--white); }
.contact-form input, .contact-form textarea, .contact-form select { border: 0; border-bottom: 2px solid var(--ink); border-radius: 0; background: transparent; }
.contact-info-cards { border: 2px solid var(--ink); border-radius: 0; background: var(--ink); }
.contact-info-cards > * { background: var(--white); }
.contact-info-cards small { color: var(--cobalt, #3047ff); }

.site-footer { border-top: 2px solid var(--lime); background-color: var(--ink); background-image: linear-gradient(rgba(217,255,67,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(217,255,67,.09) 1px,transparent 1px); background-size: 48px 48px; }
.footer-brand .brand-mark { border-color: var(--lime); }
.footer-grid h3, .footer-grid a:hover { color: var(--lime); }

/* Independent pages */
.page-hero {
	min-height: 610px;
	padding-top: 152px;
	border-bottom: 2px solid var(--ink);
	background-color: var(--cobalt, #3047ff);
	background-image: linear-gradient(rgba(255,255,255,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.13) 1px,transparent 1px);
	background-size: 48px 48px;
}
.page-hero::before { position: absolute; right: 3vw; bottom: -55px; content: attr(data-section); width: 220px; height: 220px; border: 32px solid var(--lime); border-radius: 50%; opacity: .85; }
.breadcrumbs { color: var(--lime); font-family: monospace; font-size: 9px; text-transform: uppercase; }
.page-hero h1 { max-width: 1080px; font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: clamp(64px,8vw,112px); font-weight: 400; line-height: .88; }
.page-hero-inner > p:last-child { padding-left: 18px; border-left: 2px solid var(--lime); color: rgba(255,255,255,.82); }
.profile-layout { gap: 90px; }
.about-metrics { border-block: 2px solid var(--ink); background: var(--lime); }
.value-grid { border-width: 2px; border-color: var(--ink); }
.value-grid article { border-width: 2px; border-color: var(--ink); background: var(--white); }
.value-grid article:nth-child(2n) { background: #dde1ff; }
.value-grid article > span, .application-card > span, .qualification-grid article > span, .product-document-grid article > span { color: var(--cobalt, #3047ff); font-family: monospace; }
.value-grid h3 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 27px; font-weight: 400; }
.cooperation-panel { border: 2px solid var(--ink); border-radius: 0; box-shadow: 10px 10px 0 var(--cobalt, #3047ff); }
.home-link-grid { gap: 28px; }
.home-link-grid a { min-height: 300px; border: 2px solid var(--ink); border-radius: 0; background: var(--white); box-shadow: 8px 8px 0 var(--ink); }
.home-link-grid a:first-child { color: var(--white); background: var(--cobalt, #3047ff); }
.home-link-grid a:hover { box-shadow: 12px 12px 0 var(--lime); transform: translate(-4px,-4px); }
.home-link-grid h3 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 36px; font-weight: 400; }
.home-link-grid b, .home-link-grid a:first-child b { color: var(--lime); }
.home-cta { border-block: 2px solid var(--ink); background: var(--lime); }
.home-cta .button { color: var(--white); border-color: var(--ink); background: var(--cobalt, #3047ff); }
.evidence-panel > div { border-color: rgba(255,255,255,.3); }
.application-card { border: 2px solid var(--ink); border-radius: 0; box-shadow: 7px 7px 0 var(--ink); }
.application-card:nth-child(2n) { background: #dde1ff; }
.application-icon { border: 2px solid var(--ink); border-radius: 0; background: var(--lime); }
.application-card h2 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 39px; font-weight: 400; }
.application-card li::before { border-radius: 0; background: var(--cobalt, #3047ff); }
.solution-steps { border-color: var(--ink); }
.solution-steps > div { border-color: var(--ink); }
.solution-steps span { color: var(--cobalt, #3047ff); font-family: monospace; }
.workflow-grid { gap: 2px; border: 2px solid var(--ink); border-radius: 0; background: var(--ink); }
.workflow-grid article > span { border-radius: 0; background: var(--lime); color: var(--ink); }
.facility-grid article { border: 2px solid var(--ink); border-radius: 0; box-shadow: 6px 6px 0 var(--ink); }
.facility-grid strong { color: var(--cobalt, #3047ff); font-family: "Instrument Serif", serif; font-weight: 400; }
.quality-band { background: var(--cobalt, #3047ff); }
.quality-band h2 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 42px; font-weight: 400; }
.qualification-grid article { border: 2px solid var(--ink); border-radius: 0; box-shadow: 7px 7px 0 var(--ink); }
.qualification-grid article:nth-child(2) { background: var(--lime); }
.qualification-grid h2, .product-document-grid h2 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 31px; font-weight: 400; }
.contact-business h2 { font-size: clamp(50px,6vw,76px); }
.contact-next { border-top: 2px solid var(--lime); background: var(--cobalt, #3047ff); }
.contact-next span { color: var(--lime); font-family: monospace; }

.product-detail-hero { padding: 158px 0 108px; border-bottom: 2px solid var(--lime); background-color: var(--ink); background-image: linear-gradient(rgba(217,255,67,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(217,255,67,.09) 1px,transparent 1px); background-size: 48px 48px; }
.product-detail-copy h1 { font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: clamp(62px,7vw,104px); font-weight: 400; line-height: .9; }
.product-detail-copy > p { padding-left: 18px; border-left: 2px solid var(--lime); color: rgba(255,255,255,.76); }
.detail-pack-visual { min-height: 500px; border: 2px solid var(--lime); border-radius: 0; background: var(--cobalt, #3047ff); box-shadow: 12px 12px 0 var(--lime); }
.detail-pack-visual::before { width: 360px; height: 360px; border: 2px solid var(--lime); border-radius: 0; box-shadow: 42px 42px 0 rgba(217,255,67,.13); transform: rotate(13deg); }
.pack-large { border-radius: 2px; }
.detail-reg { color: var(--lime); font-family: monospace; }
.spec-table { border-top: 2px solid var(--ink); }
.spec-table > div { border-bottom: 1px solid var(--ink); }
.product-document-grid article { border: 2px solid var(--ink); border-radius: 0; box-shadow: 7px 7px 0 var(--ink); }
.product-document-grid article:nth-child(2) { background: #dde1ff; }

@media (max-width: 1100px) {
	.container { width: min(calc(100% - 52px), var(--container)); }
	.desktop-nav { gap: 16px; }
	.desktop-nav a { font-size: 9px; }
	.hero h1 { font-size: clamp(70px,8vw,98px); }
}

@media (max-width: 860px) {
	body::before { display: none; }
	.container { width: min(calc(100% - 34px), var(--container)); }
	.site-header, .site-header.is-scrolled { color: var(--white); background: rgba(21,23,16,.97); }
	.mobile-nav { top: 86px; height: calc(100vh - 86px); padding: 26px 22px; color: var(--white); background: var(--ink); }
	.mobile-nav a { border-bottom: 1px solid rgba(255,255,255,.3); font-family: "Instrument Serif", "Noto Sans SC", serif; font-size: 28px; font-weight: 400; }
	.hero { padding-top: 142px; }
	.hero-layout { grid-template-columns: 1fr; }
	.hero h1 { font-size: clamp(66px,14vw,100px); }
	.hero-visual { min-height: 560px; }
	.science-card { right: 50%; transform: translateX(50%) rotate(1deg); }
	.trust-grid > div:nth-child(3) { border-left: 1px solid var(--ink); }
	.technology-grid { gap: 22px; }
	.page-hero { min-height: 560px; padding-top: 145px; }
	.page-hero::before { right: -70px; }
	.page-hero h1 { font-size: clamp(58px,12vw,86px); }
	.product-detail-layout { grid-template-columns: 1fr; }
}

@media (max-width: 580px) {
	.container { width: min(calc(100% - 28px), var(--container)); }
	.section { padding: 82px 0; }
	.header-inner { min-height: 74px; }
	.mobile-nav { top: 74px; height: calc(100vh - 74px); }
	.brand-mark { width: 40px; height: 40px; }
	.brand-copy strong { font-size: 16px; }
	.hero { min-height: auto; padding-top: 122px; }
	.hero::before { top: 110px; left: -160px; }
	.hero::after { top: 90px; right: 15px; }
	.hero h1 { font-size: clamp(58px,18vw,82px); line-height: .86; }
	.hero-lead { font-size: 14px; }
	.hero-actions { gap: 22px; }
	.hero-visual { min-height: 490px; }
	.science-card { min-height: 440px; padding: 18px; box-shadow: 8px 8px 0 var(--cobalt, #3047ff); }
	.drop-visual { height: 285px; }
	.hero-badge { right: 0; width: 112px; height: 112px; }
	.trust-grid { grid-template-columns: 1fr 1fr; }
	.trust-grid > div { min-height: 125px; padding: 18px 15px; }
	.trust-grid strong { font-size: 39px; }
	.section-heading h2, .application-heading h2, .contact-copy h2 { font-size: 47px; }
	.capability-rail article { min-height: 270px; }
	.technology-card { padding: 26px 22px 30px; }
	.tech-copy h3, .technology-grid-detail .tech-copy h2 { font-size: 36px; }
	.product-card, .facility-grid article, .qualification-grid article, .product-document-grid article { box-shadow: 5px 5px 0 var(--ink); }
	.application-section { padding: 82px 0; }
	.application-list > div, .application-list > a { grid-template-columns: 34px 1fr; }
	.page-hero { min-height: 510px; padding-top: 125px; }
	.page-hero h1 { font-size: clamp(50px,15vw,68px); }
	.page-hero-inner > p:last-child { font-size: 14px; }
	.cooperation-panel { box-shadow: 6px 6px 0 var(--cobalt, #3047ff); }
	.home-link-grid h3 { font-size: 32px; }
	.application-card h2 { font-size: 34px; }
	.quality-band h2 { font-size: 36px; }
	.contact-business h2 { font-size: 48px; }
	.product-detail-hero { padding-top: 126px; }
	.product-detail-copy h1 { font-size: 56px; }
	.detail-pack-visual { min-height: 405px; box-shadow: 7px 7px 0 var(--lime); }
}

/* ================================================================
   TIANFA / NATURAL PRECISION 3.0
   Quiet, image-led agricultural science with refined editorial rhythm.
   ================================================================ */
:root {
	--ink: #14251d;
	--ink-soft: #607067;
	--green-950: #071c14;
	--green-900: #0b2d21;
	--green-800: #10412f;
	--green-700: #166044;
	--green-600: #1d7351;
	--green-500: #4e936e;
	--lime: #b9d56f;
	--lime-light: #e3ecc5;
	--aqua: #afcbc1;
	--sand: #eeeae1;
	--paper: #f7f6f1;
	--white: #fffefa;
	--line: rgba(20,37,29,.14);
	--shadow: 0 28px 80px rgba(7,28,20,.11);
	--radius: 14px;
	--container: 1240px;
	--cobalt: #1d7351;
}

body {
	color: var(--ink);
	background: var(--paper);
	font-family: "Space Grotesk", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}
body::before { display: none; }
::selection { color: var(--white); background: var(--green-700); }
.container { width: min(calc(100% - 48px), var(--container)); }
.section { padding: 126px 0; }
.section-dark { background: var(--green-950); }
.js .reveal { transform: translateY(22px); transition-duration: .7s; }

.site-header {
	color: var(--white);
	border-bottom: 1px solid rgba(255,255,255,.14);
	background: rgba(5,24,17,.36);
	backdrop-filter: blur(10px);
	transition: background .3s ease, box-shadow .3s ease;
}
.site-header.is-scrolled { color: var(--white); border-bottom-color: transparent; background: rgba(7,28,20,.95); box-shadow: 0 10px 34px rgba(0,0,0,.12); }
.header-inner { min-height: 84px; }
.brand { gap: 11px; }
.brand-mark { width: 44px; height: 44px; padding: 0; border: 0; }
.brand-copy strong { font-size: 19px; font-weight: 700; letter-spacing: .14em; }
.brand-copy small { margin-top: 5px; color: rgba(255,255,255,.64); font-size: 7px; letter-spacing: .18em; }
.desktop-nav { gap: 30px; counter-reset: none; }
.desktop-nav a { display: block; font-size: 12px; font-weight: 550; letter-spacing: 0; }
.desktop-nav a::before { display: none; content: none; }
.desktop-nav a::after { bottom: -9px; height: 1px; background: var(--lime); }
.language-toggle { padding: 7px 9px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; }
.button {
	min-height: 52px;
	padding: 0 24px;
	color: var(--white);
	border: 1px solid var(--green-700);
	border-radius: 4px;
	background: var(--green-700);
	box-shadow: none;
	font-size: 12px;
	font-weight: 650;
	letter-spacing: .02em;
	text-transform: none;
}
.button:hover, .button:focus-visible { color: var(--green-950); border-color: var(--lime); background: var(--lime); box-shadow: none; transform: translateY(-2px); }
.button-small, .is-scrolled .button-small { min-height: 42px; color: var(--green-950); border-color: var(--lime); background: var(--lime); }

.hero {
	min-height: 900px;
	padding: 160px 0 90px;
	background-image: linear-gradient(90deg,rgba(4,20,14,.89) 0%,rgba(4,20,14,.72) 39%,rgba(4,20,14,.26) 68%,rgba(4,20,14,.1) 100%),url("assets/images/hero-field-v3.jpg");
	background-position: center;
	background-size: cover;
}
.hero-grid { opacity: .11; background-image: linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px); background-size: 80px 80px; -webkit-mask-image: linear-gradient(to right,#000,transparent 70%); mask-image: linear-gradient(to right,#000,transparent 70%); }
.hero::before { top: 155px; left: auto; right: 6vw; width: 1px; height: 410px; border: 0; border-radius: 0; background: rgba(255,255,255,.25); box-shadow: none; opacity: 1; }
.hero::after { top: auto; right: 5vw; bottom: 112px; content: "38°17′ N  ·  116°52′ E"; color: rgba(255,255,255,.72); font-family: monospace; font-size: 9px; font-weight: 400; letter-spacing: .14em; writing-mode: vertical-rl; }
.hero-orbit { display: none; }
.hero-layout { grid-template-columns: 1fr; min-height: 650px; }
.hero-copy { max-width: 770px; }
.eyebrow { color: var(--lime); font-size: 10px; font-weight: 650; letter-spacing: .19em; }
.eyebrow > span:first-child { width: 42px; height: 1px; background: currentColor; }
.eyebrow-green { color: var(--green-600); }
.hero h1 {
	max-width: 760px;
	font-family: "Instrument Serif", "Noto Sans SC", serif;
	font-size: clamp(68px,7.2vw,104px);
	font-weight: 400;
	letter-spacing: -.045em;
	line-height: .94;
}
.hero h1 em { display: inline-block; margin-top: 8px; color: var(--white); font-style: italic; font-weight: 400; }
[data-language="zh"] .hero h1, [data-language="zh"] .page-hero h1, [data-language="zh"] .product-detail-copy h1 { font-family: "Noto Sans SC",sans-serif; font-weight: 650; letter-spacing: -.055em; line-height: 1.08; }
[data-language="zh"] .hero h1 em { font-style: normal; }
.hero-lead { max-width: 610px; margin-top: 34px; padding-left: 20px; border-left: 1px solid var(--lime); color: rgba(255,255,255,.78); font-size: 17px; line-height: 1.75; }
.hero-actions { margin-top: 38px; }
.button-light { color: var(--green-950); border-color: var(--lime); background: var(--lime); box-shadow: none; }
.button-light:hover { color: var(--white); border-color: var(--white); background: transparent; }
.text-link { font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.text-link span { color: var(--lime); }
.hero-proof { margin-top: 56px; color: rgba(255,255,255,.6); font-family: "Space Grotesk"; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.proof-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 5px rgba(185,213,111,.12); }
.proof-dot::after { border-color: var(--lime); border-radius: 50%; }
.hero-visual { display: none; }
.hero-ticker { border-top: 1px solid rgba(255,255,255,.18); background: rgba(5,24,17,.62); backdrop-filter: blur(8px); }
.ticker-track { min-height: 60px; }
.ticker-track span { color: rgba(255,255,255,.67); font-size: 9px; font-weight: 600; letter-spacing: .16em; }
.ticker-track i { width: 4px; height: 4px; border-radius: 50%; background: var(--lime); }

.trust-strip { border: 0; border-bottom: 1px solid var(--line); background: var(--white); }
.trust-grid > div { min-height: 154px; padding: 28px 34px; border-width: 0 1px 0 0; border-color: var(--line); color: var(--ink); background: transparent; }
.trust-grid > div:first-child { border-left: 1px solid var(--line); }
.trust-grid > div:nth-child(even) { color: var(--ink); background: transparent; }
.trust-grid strong { color: var(--green-800); font-family: "Instrument Serif",serif; font-size: 48px; font-weight: 400; }
.trust-grid span { color: var(--ink-soft); font-size: 11px; font-weight: 500; letter-spacing: .04em; text-transform: none; }

.intro-section, .manufacturing-section { background: var(--paper); }
.section-heading h2, .application-heading h2, .contact-copy h2, .contact-business h2, .cooperation-panel h2, .home-cta h2 {
	font-family: "Instrument Serif", "Noto Sans SC", serif;
	font-weight: 400;
	letter-spacing: -.035em;
}
.section-heading h2, .application-heading h2, .contact-copy h2 { font-size: clamp(48px,5.3vw,70px); line-height: 1.02; }
.intro-layout { gap: 130px; }
.intro-copy > p, .long-copy { color: var(--ink-soft); }
.arrow-link { color: var(--green-700); font-size: 13px; letter-spacing: 0; text-transform: none; }
.capability-rail { border-width: 1px; border-color: var(--line); background: transparent; }
.capability-rail article, .capability-rail article:first-child { min-height: 330px; border-color: var(--line); }
.capability-rail article:hover { color: var(--ink); background: var(--white); box-shadow: var(--shadow); transform: translateY(-6px); }
.capability-rail article > span, .capability-rail article:hover > span { color: #93a099; }
.capability-rail article:hover p { color: var(--ink-soft); }
.capability-rail svg, .capability-rail article:hover svg { stroke: var(--green-600); stroke-width: 1.5; }
.capability-rail h3 { font-size: 21px; }

.technology-section { border: 0; background: #e9efe9; }
.technology-grid { gap: 24px; }
.technology-card { min-height: 650px; border: 0; border-radius: 14px; box-shadow: none; }
.technology-card-dark { color: var(--white); background: linear-gradient(145deg,#0a3023,#14543b); }
.technology-card-light { border: 1px solid var(--line); background: var(--white); }
.tech-number { padding: 0; color: inherit; background: transparent; opacity: .55; }
.technology-card-light .tech-number { color: var(--ink); background: transparent; }
.solvent-graphic span { border: 1px solid rgba(255,255,255,.28); border-radius: 50%; }
.solvent-graphic span:nth-child(3) { border-color: var(--lime); }
.solvent-graphic i { border: 0; background: linear-gradient(140deg,var(--lime-light),#58a378); box-shadow: 0 22px 55px rgba(0,0,0,.16); }
.nano-graphic i { border: 0; background: radial-gradient(circle at 35% 30%,var(--lime-light),var(--green-500)); box-shadow: 0 0 0 25px rgba(78,147,110,.07),0 0 0 55px rgba(78,147,110,.035); }
.nano-graphic span { border: 0; border-radius: 50%; background: var(--green-500); box-shadow: 0 5px 18px rgba(15,93,60,.2); }
.card-kicker, .technology-card-light .card-kicker { color: var(--green-600); font-family: "Space Grotesk"; }
.technology-card-dark .card-kicker { color: var(--lime); }
.tech-copy h3, .technology-grid-detail .tech-copy h2 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: 39px; font-weight: 400; }
.technology-card-light .tech-copy > p { color: var(--ink-soft); }
.compliance-note { color: #738078; font-family: "Space Grotesk"; }

.products-section, .home-products, .product-archive-section { background: var(--white); }
.product-toolbar { gap: 8px; border-bottom: 1px solid var(--line); }
.product-toolbar button { margin: 0; padding: 10px 16px; color: var(--ink-soft); border: 1px solid var(--line); border-radius: 999px; background: transparent; font-size: 11px; letter-spacing: 0; text-transform: none; }
.product-toolbar button:hover, .product-toolbar button.is-active { color: var(--white); border-color: var(--green-700); background: var(--green-700); }
.product-grid { gap: 22px; }
.product-card { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: none; }
.product-card:hover { box-shadow: 0 24px 60px rgba(7,28,20,.12); transform: translateY(-7px); }
.product-visual { height: 300px; border: 0; background: linear-gradient(145deg,var(--product-a),var(--product-b)); }
.product-visual::before { top: -78px; right: -88px; width: 260px; height: 260px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; box-shadow: 0 0 0 44px rgba(255,255,255,.04),0 0 0 88px rgba(255,255,255,.025); transform: none; }
.product-visual::after { top: 18px; left: 18px; content: "TIANFA FORMULATION"; color: rgba(255,255,255,.65); font-family: "Space Grotesk"; font-size: 8px; letter-spacing: .13em; }
.pack { border: 0; border-radius: 12px 12px 18px 18px; box-shadow: 0 26px 45px rgba(0,0,0,.22); }
.pack-cap { border: 0; border-radius: 7px 7px 3px 3px; }
.pack-label { border: 0; border-radius: 7px; background: linear-gradient(145deg,var(--product-a),var(--product-b)); color: var(--white); }
.product-code { color: rgba(255,255,255,.65); font-family: "Space Grotesk"; }
.product-info { padding: 25px; }
.product-meta { color: var(--green-600); font-family: "Space Grotesk"; }
.product-info h3 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: 25px; font-weight: 400; }
.product-info dl { border-color: var(--line); }
.product-info > a { color: var(--green-700); font-size: 12px; letter-spacing: 0; text-transform: none; }
.product-disclaimer { border: 0; border-radius: 9px; background: #f1f4ef; }
.product-disclaimer span { border-radius: 50%; background: var(--green-600); }

.application-section { border: 0; background: linear-gradient(135deg,#071d15,#0c3828); }
.application-section::before { right: -180px; bottom: -300px; width: 700px; height: 700px; border: 1px solid rgba(185,213,111,.14); border-radius: 50%; box-shadow: 0 0 0 110px rgba(185,213,111,.025),0 0 0 220px rgba(185,213,111,.016); opacity: 1; }
.application-list { border-top: 1px solid rgba(255,255,255,.18); }
.application-list > div, .application-list > a { border-bottom: 1px solid rgba(255,255,255,.16); }
.application-list > a:hover { padding-left: 12px; color: var(--white); background: rgba(255,255,255,.035); }
.application-list > a:hover p, .application-list p { color: rgba(255,255,255,.57); }
.application-list span { color: var(--lime); font-family: "Space Grotesk"; }
.application-list h3 { font-size: 18px; }

.process-line { height: 1px; background: #b9c7bd; }
.process-line::after { background: var(--green-600); }
.process-step > span { color: var(--white); border: 7px solid var(--sand); border-radius: 50%; background: var(--green-700); box-shadow: 0 0 0 1px #b9c7bd; }
.manufacturing-callout, .quality-band, .evidence-panel { border: 0; border-radius: var(--radius); background: var(--green-800); box-shadow: none; }
.manufacturing-callout strong, .evidence-panel strong { color: var(--lime); font-family: "Instrument Serif",serif; }

.credentials-section { background: var(--white); }
.credentials-image-window { border: 0; border-radius: var(--radius); box-shadow: var(--shadow); filter: saturate(.82) contrast(1.02); }
.credentials-stamp { border: 0; border-radius: 50%; background: var(--green-700); box-shadow: 0 20px 50px rgba(5,33,23,.25); color: var(--white); transform: none; }
.credentials-stamp span { color: var(--lime); }
.contact-section, .contact-page-section { background: var(--sand); }
.contact-form-wrap, .contact-form-light { border: 0; border-radius: var(--radius); box-shadow: var(--shadow); background: var(--white); }
.contact-form input, .contact-form textarea, .contact-form select { border: 1px solid var(--line); border-radius: 5px; background: var(--paper); }
.contact-info-cards { border: 1px solid var(--line); border-radius: 10px; background: var(--line); }
.contact-info-cards small { color: var(--green-600); }

.site-footer { border-top: 0; background: var(--green-950); }
.footer-brand .brand-mark { border: 0; }
.footer-grid h3, .footer-grid a:hover { color: var(--lime); }

/* Independent page treatment */
.page-hero {
	min-height: 580px;
	padding-top: 150px;
	border: 0;
	background-image: linear-gradient(90deg,rgba(4,22,15,.91),rgba(4,22,15,.63) 55%,rgba(4,22,15,.24)),url("assets/images/hero-field-v3.jpg");
	background-position: center 48%;
	background-size: cover;
}
.page-hero::before { right: 6vw; bottom: 0; width: 1px; height: 280px; border: 0; border-radius: 0; background: rgba(255,255,255,.25); opacity: 1; }
.breadcrumbs { color: var(--lime); font-family: "Space Grotesk"; font-size: 9px; letter-spacing: .1em; }
.page-hero h1 { max-width: 960px; font-family: "Instrument Serif","Noto Sans SC",serif; font-size: clamp(58px,6.6vw,92px); font-weight: 400; line-height: .96; }
.page-hero-inner > p:last-child { border-left: 1px solid var(--lime); color: rgba(255,255,255,.73); }
.about-metrics { border-block: 1px solid var(--line); background: var(--white); }
.value-grid { border-width: 1px; border-color: var(--line); }
.value-grid article { border-width: 1px; border-color: var(--line); background: rgba(255,255,255,.52); }
.value-grid article:nth-child(2n) { background: rgba(255,255,255,.52); }
.value-grid article > span, .application-card > span, .qualification-grid article > span, .product-document-grid article > span { color: var(--green-600); font-family: "Space Grotesk"; }
.value-grid h3 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: 27px; }
.cooperation-panel { border: 0; border-radius: var(--radius); box-shadow: var(--shadow); }
.home-link-grid { gap: 22px; }
.home-link-grid a { min-height: 290px; border: 0; border-radius: var(--radius); background: var(--white); box-shadow: 0 18px 55px rgba(5,33,23,.07); }
.home-link-grid a:first-child { color: var(--white); background: var(--green-800); }
.home-link-grid a:hover { box-shadow: var(--shadow); transform: translateY(-6px); }
.home-link-grid h3 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: 34px; }
.home-link-grid b, .home-link-grid a:first-child b { color: var(--lime); }
.home-cta { border: 0; background: var(--lime-light); }
.home-cta .button { color: var(--white); border-color: var(--green-800); background: var(--green-800); }
.application-card { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: none; }
.application-card:nth-child(2n) { background: var(--white); }
.application-icon { border: 0; border-radius: 50%; background: #e7eee6; }
.application-card h2 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: 37px; }
.application-card li::before { border-radius: 50%; background: var(--green-500); }
.solution-steps, .solution-steps > div { border-color: var(--line); }
.solution-steps span { color: var(--green-600); font-family: "Space Grotesk"; }
.workflow-grid { gap: 1px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line); }
.workflow-grid article > span { border-radius: 50%; background: var(--green-700); color: var(--white); }
.facility-grid article { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: none; }
.facility-grid strong { color: var(--green-700); }
.quality-band { background: var(--green-800); }
.qualification-grid article { border: 0; border-radius: var(--radius); box-shadow: 0 18px 55px rgba(5,33,23,.07); }
.qualification-grid article:nth-child(2) { background: var(--white); }
.qualification-grid h2, .product-document-grid h2 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: 29px; }
.contact-next { border: 0; background: var(--green-800); }
.contact-next span { color: var(--lime); }

.product-detail-hero { padding: 156px 0 110px; border: 0; background: linear-gradient(135deg,#071d15,#0d3b2b); }
.product-detail-copy h1 { font-family: "Instrument Serif","Noto Sans SC",serif; font-size: clamp(58px,6.4vw,90px); font-weight: 400; line-height: .96; }
.product-detail-copy > p { border-left: 1px solid var(--lime); color: rgba(255,255,255,.65); }
.detail-pack-visual { min-height: 500px; border: 0; border-radius: 18px; background: linear-gradient(145deg,var(--product-a),var(--product-b)); box-shadow: 0 35px 90px rgba(0,0,0,.25); }
.detail-pack-visual::before { width: 390px; height: 390px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; box-shadow: 0 0 0 55px rgba(255,255,255,.035); transform: none; }
.pack-large { border-radius: 18px 18px 25px 25px; }
.detail-reg { color: rgba(255,255,255,.6); font-family: "Space Grotesk"; }
.spec-table { border-top: 1px solid var(--line); }
.spec-table > div { border-bottom: 1px solid var(--line); }
.product-document-grid article { border: 0; border-radius: var(--radius); box-shadow: 0 18px 55px rgba(5,33,23,.07); }
.product-document-grid article:nth-child(2) { background: var(--white); }

@media (max-width: 1100px) {
	.container { width: min(calc(100% - 42px),var(--container)); }
	.desktop-nav { gap: 18px; }
	.desktop-nav a { font-size: 11px; }
}

@media (max-width: 860px) {
	.site-header, .site-header.is-scrolled { color: var(--white); background: rgba(7,28,20,.93); }
	.mobile-nav { top: 84px; height: calc(100vh - 84px); padding: 30px 24px; color: var(--white); background: var(--green-950); }
	.mobile-nav a { border-bottom: 1px solid rgba(255,255,255,.15); font-family: "Space Grotesk","Noto Sans SC"; font-size: 21px; font-weight: 550; }
	.hero { min-height: 930px; padding-top: 145px; background-image: linear-gradient(180deg,rgba(4,20,14,.8) 0%,rgba(4,20,14,.55) 54%,rgba(4,20,14,.3) 100%),url("assets/images/hero-field-v3.jpg"); background-position: 62% center; }
	.hero h1 { font-size: clamp(62px,13vw,88px); }
	.hero::before { right: 25px; }
	.page-hero { min-height: 560px; background-position: 60% center; }
	.page-hero::before { right: 25px; }
	.page-hero h1 { font-size: clamp(54px,11vw,78px); }
}

@media (max-width: 580px) {
	.container { width: min(calc(100% - 28px),var(--container)); }
	.section { padding: 86px 0; }
	.header-inner { min-height: 74px; }
	.mobile-nav { top: 74px; height: calc(100vh - 74px); }
	.hero { min-height: 850px; padding-top: 120px; background-position: 66% center; }
	.hero::before { top: 120px; right: 14px; height: 310px; }
	.hero::after { right: 7px; bottom: 95px; }
	.hero h1 { font-size: clamp(54px,15vw,72px); line-height: .95; }
	.hero-lead { font-size: 15px; }
	.hero-proof { max-width: 310px; margin-top: 45px; line-height: 1.65; }
	.trust-grid > div { min-height: 122px; padding: 20px 16px; }
	.trust-grid strong { font-size: 38px; }
	.section-heading h2, .application-heading h2, .contact-copy h2 { font-size: 44px; }
	.technology-card { padding: 28px 24px 32px; }
	.tech-copy h3, .technology-grid-detail .tech-copy h2 { font-size: 34px; }
	.product-card, .facility-grid article, .qualification-grid article, .product-document-grid article { box-shadow: none; }
	.page-hero { min-height: 500px; padding-top: 122px; }
	.page-hero h1 { font-size: clamp(47px,13vw,62px); }
	.home-link-grid h3 { font-size: 31px; }
	.contact-business h2 { font-size: 45px; }
	.product-detail-hero { padding-top: 124px; }
	.product-detail-copy h1 { font-size: 53px; }
	.detail-pack-visual { min-height: 395px; box-shadow: 0 24px 60px rgba(0,0,0,.22); }
}
