
:root{
  --brand:#0f9d4b;
  --brand-dark:#0b7a3b;
  --brand-deep:#1c4a38;
  --ink:#111418;
  --gray:#5c6670;
  --line:#e5e8ea;
  --bg-soft:#f0f1f1;
  --footer:#131f17;
  --pill-grad:linear-gradient(92deg,#3cb264 0%,#0b7a3b 100%);
  --radius:18px;
  --shadow:0 10px 30px rgba(15,60,35,.10);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
.wrap{max-width:1280px;margin:0 auto;padding:0 32px}

/* ===== Header ===== */
header{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.04)}
.hd{display:flex;align-items:center;gap:28px;height:92px;max-width:1400px;margin:0 auto;padding:0 32px}
.logo img{height:58px;width:auto}
nav{display:flex;gap:34px;margin-left:34px;flex:1;flex-wrap:wrap}
nav a{font-weight:700;font-size:17px;letter-spacing:.02em;color:#3b4248;padding:6px 0;position:relative;white-space:nowrap;transition:color .2s}
nav a:hover{color:var(--brand)}
nav a.active{color:#00913f;font-size:19px}
.hd-tools{display:flex;align-items:center;gap:22px}
.search-btn svg{width:26px;height:26px;stroke:#111;transition:stroke .2s}
.search-btn:hover svg{stroke:var(--brand)}
.contact-pill{display:inline-flex;align-items:center;gap:9px;background:var(--pill-grad);color:#fff;font-weight:700;font-size:15px;letter-spacing:.03em;padding:13px 26px;border-radius:999px;box-shadow:0 6px 16px rgba(11,122,59,.28);transition:transform .2s,box-shadow .2s}
.contact-pill:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(11,122,59,.36)}
.contact-pill svg{width:17px;height:17px}

/* search overlay */
.search-layer{position:fixed;inset:0;background:rgba(10,25,16,.55);backdrop-filter:blur(4px);z-index:200;display:none;align-items:flex-start;justify-content:center;padding-top:14vh}
.search-layer.open{display:flex}
.search-box{background:#fff;border-radius:16px;width:min(640px,90vw);padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.search-box input{width:100%;font-size:18px;padding:14px 18px;border:2px solid var(--line);border-radius:10px;outline:none}
.search-box input:focus{border-color:var(--brand)}
.search-res{margin-top:14px;max-height:40vh;overflow:auto}
.search-res a{display:block;padding:10px 14px;border-radius:8px;font-weight:600}
.search-res a:hover{background:#eef7f1;color:var(--brand-dark)}
.search-res .empty{color:var(--gray);padding:10px 14px;font-size:14px}

/* ===== Hero (design-baked image, proportional) ===== */
.hero{position:relative}
.hero img.bg{width:100%;height:auto;display:block}
.hero .hot{position:absolute;display:block;border-radius:999px;cursor:pointer}
.hero .hot:hover{box-shadow:0 0 0 3px rgba(255,255,255,.55),0 10px 26px rgba(0,0,0,.3)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--pill-grad);color:#fff;font-weight:700;font-size:16px;padding:14px 32px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.22);transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.3)}
.btn.ghost{background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.55)}
.btn svg{width:18px;height:18px}

/* ===== Hero text overlay (photo banners) ===== */
.hero.ovl{position:relative;overflow:hidden}
.hero.ovl .bg{width:100%;height:auto;display:block}
.hero.ovl::before{content:"";position:absolute;inset:0;z-index:1}
.home-hero::before{background:linear-gradient(90deg,rgba(6,20,14,.74) 0%,rgba(6,20,14,.42) 40%,rgba(6,20,14,0) 66%)}
.page-hero::before{background:linear-gradient(90deg,rgba(6,20,14,.7) 0%,rgba(6,20,14,.4) 42%,rgba(6,20,14,.06) 72%)}
.sol-hero .bg{filter:grayscale(.4) brightness(.9)}
.sol-hero::before{background:linear-gradient(90deg,rgba(3,12,8,.6) 0%,rgba(3,12,8,.28) 52%,rgba(3,12,8,.2) 100%)}
.hero-copy{position:absolute;inset:0;z-index:2;display:flex;align-items:center}
.hero-copy .inner{max-width:1280px;width:100%;margin:0 auto;padding:0 32px}
.hero-copy .box{max-width:620px}
.hero-copy h1{color:#fff;font-size:clamp(26px,3.4vw,52px);font-weight:800;line-height:1.18;text-shadow:0 3px 24px rgba(0,0,0,.45)}
.hero-copy .btn{margin-top:30px}
@media (max-width:680px){.hero-copy h1{font-size:22px}.hero-copy .btn{margin-top:18px;padding:11px 22px;font-size:14px}}

/* ===== Sections ===== */
section{padding:76px 0}
.sec-title{font-size:clamp(28px,3vw,42px);font-weight:800;text-align:center;letter-spacing:.01em}
.sec-sub{max-width:980px;margin:20px auto 0;text-align:center;font-size:17px;color:#2c333a;font-weight:500}
.page{display:none}
.page.active{display:block}

/* ===== Home: category strip (hover = enlarge+top, others dim) ===== */
.cat-strip{display:flex;margin-top:56px;height:480px;gap:14px}
.cat-tile{position:relative;flex:1;overflow:hidden;border-radius:18px;cursor:pointer;transition:transform .45s cubic-bezier(.34,.01,.2,1),filter .4s,box-shadow .4s}
.cat-tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.cat-tile .cat-name{position:absolute;left:0;right:0;bottom:0;padding:30px 16px 22px;text-align:center;color:#fff;font-size:20px;font-weight:800;line-height:1.3;text-shadow:0 2px 12px rgba(0,0,0,.6);background:linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.28) 60%,transparent);opacity:0;transform:translateY(12px);transition:opacity .35s,transform .35s}
.cat-strip:hover .cat-tile{filter:brightness(.48) saturate(.85)}
.cat-strip .cat-tile:hover{filter:brightness(1.04);transform:scale(1.09);z-index:5;box-shadow:0 26px 54px rgba(0,0,0,.4)}
.cat-tile:hover img{transform:scale(1.07)}
.cat-tile:hover .cat-name{opacity:1;transform:none}

/* ===== Home: about block ===== */
.about-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;align-items:start;margin-top:10px}
.about-grid h2{font-size:clamp(26px,2.6vw,36px);font-weight:800;line-height:1.3}
.about-grid .txt{margin-top:34px;color:#2c333a;font-size:16.5px}
.about-grid .txt p+p{margin-top:14px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:54px 44px;padding-top:18px}
.stat .num-row{display:flex;align-items:center;gap:14px}
.stat .ico{width:60px;height:60px;flex:none}
.stat .ico svg{width:100%;height:100%;fill:var(--brand)}
.stat .ico img{width:100%;height:100%;object-fit:contain}
.stat .num{font-size:44px;font-weight:800;color:#0c8a41}
.stat .lab{margin-top:8px;font-weight:700;font-size:16.5px;color:#1c232a;line-height:1.45}

/* ===== certs marquee ===== */
.cert-belt{overflow:hidden;margin-top:52px}
.cert-track{display:flex;align-items:center;gap:110px;width:max-content;animation:belt 28s linear infinite}
.cert-belt:hover .cert-track{animation-play-state:paused}
.cert-track img{height:150px;width:auto}
@keyframes belt{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== factory grid ===== */
.fac-sec{background:var(--bg-soft)}
.fac-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:300px;gap:16px}
.fac-grid .cell{overflow:hidden;border-radius:6px}
.fac-grid .cell img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.fac-grid .cell:hover img{transform:scale(1.07)}
.f1{grid-column:span 2}.f2{grid-column:span 2}.f3{grid-column:span 2}
.f4{grid-column:span 2}.f5{grid-column:span 2}.f6{grid-column:span 2}

/* ===== CTA quote section ===== */
.cta-quote{background:linear-gradient(135deg,#1e5340 0%,#173f30 60%,#122f24 100%);color:#fff;padding:90px 0}
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.kicker{display:flex;align-items:center;gap:12px;color:#cfe3d8;font-weight:700;letter-spacing:.22em;font-size:14px}
.kicker::before{content:"";width:34px;height:3px;background:#e8a33d;border-radius:2px}
.cta-grid h2{font-size:clamp(30px,3.2vw,46px);font-weight:800;margin-top:16px}
.cta-grid .lead{margin-top:18px;font-size:18px;font-weight:600;color:#e9f2ec}
.cta-info{margin-top:26px;display:grid;gap:14px;font-size:16.5px;color:#dce9e1}
.cta-info div{display:flex;align-items:center;gap:12px}
.cta-info svg{width:19px;height:19px;stroke:#bcd8c8;flex:none}
.form-card{background:#fff;border-radius:22px;padding:38px 40px;color:var(--ink);box-shadow:0 30px 70px rgba(0,0,0,.3)}
.form-card h3{font-size:24px;font-weight:800}
.form-card label{display:block;margin-top:20px;font-weight:700;font-size:15px;color:#26313a}
.form-card input,.form-card textarea{width:100%;margin-top:8px;padding:14px 16px;font-size:15.5px;border:1px solid #dfe3e6;background:#f7f8f8;border-radius:10px;outline:none;font-family:inherit;transition:border .2s}
.form-card input:focus,.form-card textarea:focus{border-color:var(--brand);background:#fff}
.form-card .send{width:100%;margin-top:30px;background:linear-gradient(92deg,#17573d,#0f3d2b);color:#fff;font-size:17px;font-weight:700;padding:16px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:10px;transition:filter .2s,transform .2s}
.form-card .send:hover{filter:brightness(1.15);transform:translateY(-1px)}
.form-card .note{margin-top:12px;color:#8a949c;font-size:13.5px}

/* ===== Cookie consent bar ===== */
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:300;background:#131f17;color:#e8ece9;display:none;align-items:center;gap:24px;padding:18px 32px;box-shadow:0 -6px 24px rgba(0,0,0,.25)}
.cookie-bar.show{display:flex}
.cookie-bar p{font-size:14.5px;line-height:1.55;max-width:900px;flex:1}
.cookie-bar a{color:#7fd6a4;text-decoration:underline}
.cb-btns{display:flex;gap:12px;flex:none}
.cb-btns button{font-weight:800;font-size:14px;padding:11px 24px;border-radius:999px;transition:filter .2s,transform .2s}
.cb-accept{background:var(--pill-grad);color:#fff}
.cb-accept:hover{filter:brightness(1.1);transform:translateY(-1px)}
.cb-decline{background:transparent;color:#cfe6d8;border:1px solid #56605a!important}
.cb-decline:hover{background:rgba(255,255,255,.06)}
@media(max-width:680px){.cookie-bar{flex-direction:column;align-items:stretch;gap:12px;padding:16px 18px}.cb-btns{justify-content:flex-end}}

/* ===== Footer ===== */
footer{background:var(--footer);color:#e8ece9;padding:70px 0 0}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1.2fr 1.6fr;gap:48px}
.ft-brand img{height:92px;margin-left:-8px}
.ft-brand .co{font-size:17px;font-weight:800;margin-top:10px;white-space:nowrap}
.socials{display:flex;gap:16px;margin-top:22px}
.socials a{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .2s}
.socials a:hover{transform:translateY(-3px)}
.socials svg{width:44px;height:44px}
.ft-grid h4{font-size:20px;font-weight:800;letter-spacing:.03em;margin-bottom:26px}
.ft-grid ul{list-style:none;display:grid;gap:18px;font-size:15.5px;letter-spacing:.02em}
.ft-grid ul a:hover{color:#7fd6a4}
.ft-contact p{margin-bottom:16px;font-size:15.5px;line-height:1.7}
.ft-contact a{color:#cfe6d8;text-decoration:underline}
.ft-bottom{margin-top:56px;border-top:1px solid #56605a;padding:20px 0 26px;font-size:14.5px;color:#c4ccc7}

/* ===== Products page ===== */
.hero-pill{margin-top:26px;display:inline-block;background:linear-gradient(92deg,#1d7a44,#0f5d31);color:#fff;font-weight:700;font-size:clamp(17px,1.8vw,26px);padding:14px 34px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.prod-layout{display:grid;grid-template-columns:330px 1fr;gap:56px;align-items:start}
.cat-menu{border:1px solid #d9dde0;border-radius:18px;padding:26px 22px;display:grid;gap:8px;position:sticky;top:116px}
.cat-menu button{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;font-size:20px;font-weight:800;color:#16202a;padding:18px 18px;border-radius:14px;transition:background .2s,color .2s;line-height:1.3}
.cat-menu button .arr{flex:none;width:34px;height:34px;border-radius:50%;background:#d6d9dc;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .2s}
.cat-menu button .arr svg{width:15px;height:15px}
.cat-menu button:hover{color:var(--brand-dark)}
.cat-menu button.active{background:linear-gradient(92deg,#1c5b3c,#123f28);color:#fff}
.cat-menu button.active .arr{background:rgba(255,255,255,.85);color:#1c5b3c}
.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:34px}
.brand-card{background:#fff;border:1px solid #e3e6e8;border-radius:16px;box-shadow:0 8px 22px rgba(20,40,30,.06);display:flex;align-items:center;justify-content:center;padding:14px;min-height:210px;transition:transform .25s,box-shadow .25s}
.brand-card:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(20,40,30,.12)}
.brand-card img{max-height:180px;object-fit:contain}
.p-card{background:#fff;border:1px solid #e6e9ea;border-radius:16px;overflow:hidden;box-shadow:0 8px 22px rgba(20,40,30,.06);transition:transform .25s,box-shadow .25s}
.p-card:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(20,40,30,.12)}
.p-card img.full{width:100%}
.p-card .compose{padding:16px 14px 0;text-align:center}
.p-card .compose img.mini{height:44px;margin:0 auto}
.p-card .compose .pname{margin-top:8px;font-weight:800;color:#0c8a41;font-size:16.5px;line-height:1.35;min-height:46px;display:flex;align-items:center;justify-content:center}
.p-card .ph{height:210px;background-size:cover;background-position:center bottom}
.brand-card,.p-card{cursor:pointer}

/* ===== Product detail page ===== */
.pd-back{display:inline-flex;align-items:center;gap:8px;color:#0c8a41;font-weight:800;font-size:15px;margin-bottom:24px;cursor:pointer}
.pd-back svg{width:18px;height:18px}
.pd-top{display:grid;grid-template-columns:400px 1fr;gap:56px;align-items:start}
.pd-imgbox{border:1px solid #e6e9ea;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 14px 34px rgba(20,50,35,.09)}
.pd-imgbox img{width:100%;display:block}
.pd-cat{display:inline-block;background:#e7f2ea;color:#0c8a41;font-weight:800;font-size:12.5px;letter-spacing:.05em;padding:7px 16px;border-radius:999px;text-transform:uppercase}
.pd-name{font-size:clamp(25px,2.9vw,38px);font-weight:800;margin:16px 0 14px;line-height:1.22}
.pd-intro{font-size:16.5px;color:#2c333a;line-height:1.8}
.pd-facts{margin-top:26px;border:1px solid #e6e9ea;border-radius:16px;overflow:hidden}
.pd-facts .row{display:grid;grid-template-columns:180px 1fr;font-size:15px;border-bottom:1px solid #eef1f2}
.pd-facts .row:last-child{border-bottom:none}
.pd-facts .k{padding:13px 18px;font-weight:800;color:#26313a;background:#f7f8f8}
.pd-facts .v{padding:13px 18px;color:#2c333a}
.pd-actions{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap}
.pd-sec{margin-top:54px}
.pd-sec h2{font-size:25px;font-weight:800;padding-bottom:12px;border-bottom:2px solid #e6e9ea;margin-bottom:24px}
.pd-sec h2 span{color:#0c8a41}
.pd-spec{width:100%;border-collapse:collapse;border:1px solid #e6e9ea;border-radius:12px;overflow:hidden;font-size:15px}
.pd-spec th{background:linear-gradient(92deg,#1c5b3c,#123f28);color:#fff;text-align:left;padding:14px 18px}
.pd-spec td{padding:12px 18px;border-top:1px solid #eef1f2;color:#26313a;vertical-align:top}
.pd-spec tr:nth-child(even) td{background:#fafbfb}
.pd-spec .subrow td{background:#eef5f0;font-weight:800;color:#0c8a41}
.pd-feats{display:grid;gap:16px}
.pd-feat{background:#f7f9f8;border-left:4px solid #0f9d4b;border-radius:0 12px 12px 0;padding:18px 22px}
.pd-feat h4{font-size:18px;font-weight:800;color:#15202a}
.pd-feat h4+p{margin-top:8px}
.pd-feat p{color:#3a424a;font-size:15.5px;line-height:1.75}
.pd-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 34px}
.pd-list li{position:relative;padding-left:26px;font-size:16px;color:#2c333a;line-height:1.6}
.pd-list li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;border-radius:50%;background:#0f9d4b}
.pd-eyebrow{display:inline-block;font-family:ui-monospace,Menlo,monospace;font-size:12.5px;font-weight:700;letter-spacing:.08em;color:var(--brand-dark);text-transform:uppercase;margin-bottom:12px}
.pd-num{display:inline-flex;align-items:center;justify-content:center;font-family:ui-monospace,Menlo,monospace;font-size:14px;font-weight:800;color:#0c8a41;margin-right:13px;background:#e7f2ea;border-radius:8px;padding:3px 11px;vertical-align:middle}
.pd-kp{margin-top:24px;background:#f2f9f5;border:1px solid #d9ebe0;border-radius:14px;padding:18px 22px}
.pd-kp-h{font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#0c8a41;margin-bottom:13px}
.pd-kp ul{list-style:none;display:grid;gap:10px}
.pd-kp li{position:relative;padding-left:27px;font-size:15px;font-weight:650;color:#1c2a22;line-height:1.45}
.pd-kp li::before{content:"✓";position:absolute;left:0;top:0;color:#0f9d4b;font-weight:900}
.pd-empty{color:var(--gray);font-size:15px;font-style:italic;margin:2px 0}
@media(max-width:900px){.pd-top{grid-template-columns:1fr;gap:32px}.pd-list{grid-template-columns:1fr}.pd-facts .row{grid-template-columns:140px 1fr}}

/* ===== Solutions page ===== */
.why-card{background:#fff;border-radius:26px;box-shadow:0 18px 50px rgba(20,50,35,.10);padding:56px 60px;margin-top:-90px;position:relative;z-index:5}
.why-card h2{font-size:clamp(26px,2.8vw,38px);font-weight:800}
.why-card p{margin-top:22px;font-size:17.5px;color:#2c333a;line-height:2.05}
.chevs{display:flex;justify-content:center;margin:34px 0 8px}
.chevs svg{width:40px;height:40px;stroke:#0c8a41;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.sol-car{position:relative;margin-top:10px;overflow:hidden}
.sol-car .track{display:flex;gap:26px;will-change:transform}
.sol-car .track img{width:calc((100% - 52px)/3);height:360px;object-fit:cover;border-radius:12px;flex:none}
.sol-car::before,.sol-car::after{content:"";position:absolute;top:0;bottom:0;width:11%;z-index:3;pointer-events:none}
.sol-car::before{left:0;background:linear-gradient(90deg,#fff 6%,rgba(255,255,255,0))}
.sol-car::after{right:0;background:linear-gradient(270deg,#fff 6%,rgba(255,255,255,0))}
.car-arrow{position:absolute;top:50%;transform:translateY(-50%);font-size:34px;color:#fff;background:#0f9d4b;font-weight:800;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:4;box-shadow:0 8px 22px rgba(12,120,60,.35);transition:transform .22s,background .22s,box-shadow .22s}
.car-arrow:hover{background:#0b7a3b;transform:translateY(-50%) scale(1.14);box-shadow:0 12px 28px rgba(9,70,31,.45)}
.car-arrow.prev{left:14px}.car-arrow.next{right:14px}
.scroll-cue{display:flex;justify-content:center;margin-top:30px}
.scroll-cue svg{width:42px;height:42px;stroke:#0f9d4b;animation:bob 1.6s ease-in-out infinite}
.scroll-cue:hover svg{stroke:#0b5c2f}
.process-sec{background:var(--bg-soft)}
.process-sec .sec-title{text-align:left}
.proc-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px 44px;margin-top:48px}
.proc-card{background:#fff;border:1px solid #e2e5e7;border-radius:4px 4px 26px 4px;padding:30px 34px;transition:transform .25s,box-shadow .25s;border-top-left-radius:26px}
.proc-card:hover{transform:translateY(-6px) ;box-shadow:0 20px 40px rgba(20,60,40,.16)}
.proc-card .no{display:inline-block;background:#8fbf9f;color:#fff;font-weight:800;font-size:15px;padding:5px 11px;border-radius:8px}
.proc-card h3{margin-top:16px;font-size:22px;font-weight:800}
.proc-card p{margin-top:8px;color:#3a424a;font-size:15.5px}
.trend-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:44px;margin-top:56px}
.trend-card{background:#fff;border:1px solid #e0e4e6;border-radius:16px;width:min(360px,100%);padding:44px 30px;text-align:center;box-shadow:0 10px 26px rgba(20,40,30,.07);transition:transform .25s,box-shadow .25s;cursor:pointer}
.trend-card:hover{transform:translateY(-8px);box-shadow:0 22px 44px rgba(20,60,40,.16)}
.trend-card svg{width:96px;height:96px;margin:0 auto 26px;stroke:#0c8a41}
.trend-card img{width:96px;height:96px;object-fit:contain;margin:0 auto 26px;display:block}
.trend-card h3{font-size:22px;font-weight:800;line-height:1.4}
.adv-box{background:#c2d2c9;border-radius:18px;padding:34px 46px;display:grid;grid-template-columns:1fr 1fr;gap:18px 40px;margin:44px auto 0;max-width:1180px;font-size:19px;font-weight:600;color:#25313a}
.adv-box div::before{content:"·";font-weight:900;margin-right:10px}
.cdmo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:52px}
.cdmo-grid img{width:100%;height:250px;object-fit:cover;border-radius:10px}
.usa-sec{background:var(--bg-soft)}
.usa-sec .sec-title{text-align:left}
.usa-icons{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:56px;text-align:center}
.usa-icons .disc{width:110px;height:110px;border-radius:50%;background:#dde5df;margin:0 auto;display:flex;align-items:center;justify-content:center}
.usa-icons svg{width:52px;height:52px;stroke:#1c4a38}
.usa-icons h3{margin-top:22px;font-size:22px;font-weight:800}
.usa-lead{margin-top:50px;font-size:clamp(18px,1.9vw,27px);font-weight:600;color:#1c232a;line-height:1.9;max-width:1200px}
.bene-h{margin-top:44px;font-size:23px;font-weight:800}
.bene-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 80px;margin-top:22px;font-size:18px;color:#3a424a}
.bene-grid div{display:flex;gap:12px;align-items:center}
.bene-grid svg{width:20px;height:20px;stroke:#0c8a41;flex:none}
.qc-sec .sec-title{text-align:left}
.tag-pill{display:inline-block;color:#fff;font-weight:800;font-size:20px;padding:10px 30px;border-radius:999px;margin:44px 0 10px}
.tag-pill.light{background:#6cbf47}
.tag-pill.dark{background:#0f7a3b}
.sup-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 60px;margin-top:26px;max-width:900px;font-size:19px;font-weight:700;color:#3a424a}
.sup-grid div{display:flex;align-items:center;gap:16px}
.sup-grid i{width:14px;height:14px;border-radius:50%;background:#0c8a41;box-shadow:0 0 10px 3px rgba(12,138,65,.45);flex:none}
.cta-band{background:linear-gradient(135deg,#1e5340,#122f24);color:#fff;text-align:center;padding:86px 0}
.cta-band h2{font-size:clamp(28px,3vw,42px);font-weight:800}
.cta-band p{margin:22px auto 0;font-size:19px;font-weight:600;max-width:900px;color:#e6efe9}
.cta-band .btns{margin-top:40px;display:flex;gap:26px;justify-content:center;flex-wrap:wrap}

/* ===== US Stock ===== */
.stock-table{margin-top:8px;border:1px solid #d8dcdf;border-radius:26px;overflow:hidden;box-shadow:0 14px 36px rgba(20,50,35,.08)}
.stock-table .thead{display:grid;grid-template-columns:1fr 300px 360px;background:linear-gradient(92deg,#1c5b3c,#123f28);color:#fff;font-size:clamp(20px,2vw,30px);font-weight:800;padding:26px 46px;letter-spacing:.02em}
.stock-table .thead span:nth-child(2){text-align:center}
.stock-table .thead span:nth-child(3){text-align:center}
.stock-table .row{display:grid;grid-template-columns:1fr 300px 360px;align-items:center;padding:20px 46px;font-size:19px;font-weight:700;color:#15202a;background:#fff;transition:transform .18s,box-shadow .18s,background .18s;position:relative}
.stock-table .row:nth-child(odd){background:#fbfcfb}
.stock-table .row:hover{transform:translateY(-3px) scale(1.012);background:#f2faf5;box-shadow:0 12px 26px rgba(15,90,50,.14);z-index:3;border-radius:10px}
.stock-table .row .cas,.stock-table .row .spec{text-align:center;font-weight:600;color:#26313a}
.stock-table .row em{font-style:normal;color:#0c8a41}

/* ===== About ===== */
.about-hero{min-height:640px;align-items:flex-start;padding-top:150px}
.about-hero h1{font-size:clamp(40px,5vw,68px)}
.who-panel{background:rgba(80,124,101,.82);border-radius:26px;margin-top:170px;padding:48px 60px;text-align:center;backdrop-filter:blur(2px)}
.who-panel h2{font-size:clamp(24px,2.6vw,36px);font-weight:800}
.who-panel p{margin-top:20px;font-size:17.5px;font-weight:600;line-height:2.15;text-shadow:0 1px 8px rgba(0,0,0,.18)}
.sci-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;align-items:start}
.sci-grid h2{font-size:clamp(28px,3vw,40px);font-weight:800;color:#0c8a41;line-height:1.6}
.sci-grid .sub{margin-top:24px;font-size:18px;font-weight:700;color:#26313a}
.sci-items{display:grid;gap:38px}
.sci-item{display:grid;grid-template-columns:88px 1fr;gap:26px;align-items:start}
.sci-item svg{width:78px;height:78px;stroke:#0c8a41}
.sci-item img{width:78px;height:78px;object-fit:contain}
.sci-item h3{font-size:21.5px;font-weight:800}
.sci-item h3::before{content:"· "}
.sci-item p{margin-top:8px;color:#3a424a;font-size:16.5px}
.map-wrap{margin-top:54px;position:relative}
.map-wrap img.map{width:100%;border-radius:8px}
.map-hot{position:absolute;width:2.6%;aspect-ratio:1;cursor:pointer;z-index:2}
.map-hot .pin{position:absolute;inset:0;border-radius:50%;background:#16c163;border:2px solid #fff;box-shadow:0 0 0 0 rgba(18,184,92,.55);animation:breathe 2.4s ease-in-out infinite}
.map-hot:hover .pin,.map-hot.active .pin{background:#0c8a41;transform:scale(1.4);animation:none;box-shadow:0 0 0 7px rgba(18,184,92,.28)}
@keyframes breathe{0%,100%{box-shadow:0 0 0 0 rgba(18,184,92,.55);filter:brightness(1)}50%{box-shadow:0 0 0 11px rgba(18,184,92,0);filter:brightness(1.22)}}
.map-hot .mtip{position:absolute;bottom:150%;left:50%;transform:translateX(-50%) translateY(10px) scale(.95);width:236px;background:#fff;border-radius:14px;box-shadow:0 20px 48px rgba(0,0,0,.3);overflow:hidden;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:8}
.map-hot .mtip img{width:100%;height:136px;object-fit:cover;display:block;border-radius:0}
.map-hot .mtip span{display:block;padding:11px 14px;font-size:13.5px;font-weight:700;color:#15202a;line-height:1.35}
.map-hot:hover .mtip,.map-hot.active .mtip{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
.loc-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:36px;margin-top:26px}
.loc-card{border-radius:18px;padding:38px 34px;text-align:center;transition:background .3s,transform .25s}
.loc-card .dot{width:26px;height:26px;border-radius:50%;background:#3f4a44;margin:0 auto}
.loc-card h3{margin-top:20px;font-size:25px;font-weight:800}
.loc-card .role{margin-top:4px;font-size:18.5px;font-weight:700;color:#26313a}
.loc-card p{margin-top:20px;color:#3a424a;font-size:16px}
.loc-card.hl,.loc-card:hover{background:#ddefe0;transform:translateY(-6px);box-shadow:0 18px 40px rgba(20,80,45,.14)}
.loc-card.hl .dot,.loc-card:hover .dot{background:#0c8a41;animation:breathe 2.4s ease-in-out infinite}

/* ===== News ===== */
.tabs{display:flex;margin-top:6px}
.tabs button{font-size:clamp(20px,2vw,28px);font-weight:800;padding:20px 64px;border-radius:0 999px 999px 0;background:#c9ccce;color:#fff;letter-spacing:.05em}
.tabs button:first-child{border-radius:999px 0 999px 999px;background:linear-gradient(92deg,#1c5b3c,#123f28);z-index:2}
.tabs button.inact{background:#c9ccce;color:#fff}
.tabs button.act{background:linear-gradient(92deg,#1c5b3c,#123f28);color:#fff;z-index:2}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:60px}
.news-card{border:1px solid #22301f22;border-radius:22px;overflow:hidden;background:#fff;border:1.5px solid #23402f33;box-shadow:0 8px 22px rgba(20,40,30,.05);transition:transform .25s,box-shadow .25s;display:flex;flex-direction:column}
.news-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(20,60,40,.14)}
.news-card img{width:100%;height:250px;object-fit:cover}
.news-card .body{padding:24px 26px 28px;display:flex;flex-direction:column;flex:1}
.news-card .date{color:#0c8a41;font-weight:800;font-size:15px}
.news-card h3{margin-top:10px;font-size:20px;font-weight:800;line-height:1.45}
.news-card p{margin-top:12px;color:#3a424a;font-size:15.5px;flex:1}
.news-card .rm{margin-top:18px;color:#0c8a41;font-weight:800;display:inline-flex;align-items:center;gap:8px}
.news-card .rm svg{width:18px;height:18px;transition:transform .2s}
.news-card:hover .rm svg{transform:translateX(5px)}
.news-card{cursor:pointer}

/* ===== Article (news/insight) detail ===== */
.post-wrap{max-width:820px;margin:0 auto}
.post-back{display:inline-flex;align-items:center;gap:8px;color:#0c8a41;font-weight:800;font-size:15px;margin-bottom:26px;cursor:pointer}
.post-back svg{width:18px;height:18px}
.post-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.post-cat{display:inline-block;background:#e7f2ea;color:#0c8a41;font-weight:800;font-size:12.5px;letter-spacing:.05em;padding:7px 16px;border-radius:999px;text-transform:uppercase}
.post-date{color:var(--gray);font-weight:700;font-size:14.5px}
.post-title{font-size:clamp(27px,3.4vw,42px);font-weight:850;line-height:1.2;letter-spacing:-.01em}
.post-hero{margin:32px 0 8px;border-radius:20px;overflow:hidden;box-shadow:0 16px 40px rgba(20,50,35,.12)}
.post-hero img{width:100%;display:block}
.post-body{font-size:17px;color:#2c333a;line-height:1.85}
.post-body p{margin-top:20px}
.post-body p.lead{font-size:19.5px;color:#1c232a;font-weight:600;line-height:1.7}
.post-body h3{font-size:22px;font-weight:800;color:#15202a;margin-top:40px;line-height:1.35}
.post-body ul{list-style:none;margin-top:16px;display:grid;gap:11px}
.post-body ul li{position:relative;padding-left:28px;font-size:16.5px}
.post-body ul li::before{content:"";position:absolute;left:2px;top:11px;width:8px;height:8px;border-radius:50%;background:#0f9d4b}
.post-cta{margin-top:52px;background:linear-gradient(135deg,#1e5340,#122f24);border-radius:22px;padding:44px 46px;text-align:center;color:#fff}
.post-cta h3{font-size:24px;font-weight:800}
.post-cta p{margin-top:12px;color:#dce9e1;font-size:16px}
.post-cta .btns{margin-top:26px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
@media(max-width:680px){.post-cta{padding:32px 24px}}

/* ===== Contact ===== */
.contact-layout{display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:start}
.contact-layout .kicker{color:#0c8a41}
.contact-layout .kicker::before{background:#e8a33d}
.contact-layout h2{font-size:clamp(28px,3vw,40px);font-weight:800;margin-top:14px}
.info-cards{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:38px}
.info-card{border:1px solid #e2e6e8;border-radius:16px;padding:30px 28px;box-shadow:0 8px 20px rgba(20,40,30,.05)}
.info-card .disc{width:64px;height:64px;border-radius:16px;background:#e7f2ea;display:flex;align-items:center;justify-content:center}
.info-card svg{width:30px;height:30px;stroke:#1c4a38}
.info-card h3{margin-top:18px;font-size:20px;font-weight:800}
.info-card p{margin-top:10px;color:#4a545d;font-size:15.5px;line-height:1.8}
.contact-form{background:#fff;border:1px solid #e4e7e9;border-radius:22px;padding:40px 44px;box-shadow:0 24px 60px rgba(20,50,35,.10)}
.contact-form h3{font-size:24px;font-weight:800}
.form-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.contact-form label{display:block;margin-top:20px;font-weight:700;font-size:15px;color:#26313a}
.contact-form input,.contact-form textarea{width:100%;margin-top:8px;padding:14px 16px;font-size:15.5px;border:1px solid #dfe3e6;background:#f7f8f8;border-radius:10px;outline:none;font-family:inherit;transition:border .2s}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--brand);background:#fff}
.contact-form .send{width:100%;margin-top:30px;background:linear-gradient(92deg,#17573d,#0f3d2b);color:#fff;font-size:17px;font-weight:700;padding:16px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:10px;transition:filter .2s}
.contact-form .send:hover{filter:brightness(1.15)}
.contact-form .note{margin-top:12px;color:#8a949c;font-size:13.5px}

/* count-up target look */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}

@media (max-width:1080px){
  nav{gap:20px}
  .about-grid,.cta-grid,.sci-grid,.contact-layout{grid-template-columns:1fr}
  .prod-layout{grid-template-columns:1fr}
  .cat-menu{position:static}
  .news-grid,.cdmo-grid{grid-template-columns:1fr 1fr}
  .cat-strip{flex-wrap:wrap;height:auto}
  .cat-tile{clip-path:none!important;margin-left:0;min-width:46%;height:300px}
  .fac-grid{grid-template-columns:1fr 1fr}
  .f1,.f2,.f3,.f4,.f5,.f6{grid-column:span 1}
  .stock-table .thead,.stock-table .row{grid-template-columns:1fr 130px 160px;padding:16px 20px;font-size:15px}
  .loc-grid{grid-template-columns:1fr}
}
@media (max-width:680px){
  .hd{height:auto;flex-wrap:wrap;padding:12px 18px}
  nav{order:3;margin-left:0;width:100%;justify-content:space-between}
  .news-grid,.cdmo-grid,.proc-grid,.bene-grid,.sup-grid,.adv-box,.info-cards,.form-2col,.stats{grid-template-columns:1fr}
}

.cat-menu .cm-item{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;font-size:19px;font-weight:800;color:#16202a;padding:16px 18px;border-radius:14px;transition:background .2s,color .2s;line-height:1.3;text-decoration:none}
.cat-menu .cm-item .arr{flex:none;width:34px;height:34px;border-radius:50%;background:#d6d9dc;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .2s}
.cat-menu .cm-item .arr svg{width:15px;height:15px}
.cat-menu .cm-item:hover{color:var(--brand-dark)}
.cat-menu .cm-item.active{background:linear-gradient(92deg,#1c5b3c,#123f28);color:#fff}
.cat-menu .cm-item.active .arr{background:rgba(255,255,255,.85);color:#1c5b3c}
.cat-block:first-child{margin-top:0}
.tile-link{position:absolute;inset:0;z-index:3}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips .chip{font-size:14px;font-weight:700;padding:9px 18px;border-radius:999px;background:#eef1f2;color:#26313a;transition:background .2s,color .2s}
.chips .chip:hover{background:#dfe8e2}
.chips .chip.on{background:linear-gradient(92deg,#1c5b3c,#123f28);color:#fff}
.cat-block{margin-top:52px}
.cat-block-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;border-bottom:2px solid #e6e9ea;padding-bottom:12px;margin-bottom:26px}
.cat-block-h h2{font-size:24px;font-weight:800}.cat-block-h h2 a{color:inherit}
.cat-block-h .more{font-weight:800;color:#0c8a41;white-space:nowrap}
.p-card,.brand-card{text-decoration:none;color:inherit}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px}
.rel-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:16px;border:1px solid #e6e9ea;border-radius:14px;background:#fff;font-weight:700;font-size:14px;color:#15202a;transition:transform .2s,box-shadow .2s}
.rel-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(20,50,35,.1)}
.rel-card img{width:100%;border-radius:8px}
.pd-faq details{border:1px solid #e6e9ea;border-radius:12px;padding:2px 20px;margin-bottom:12px;background:#fff}
.pd-faq summary{cursor:pointer;font-weight:750;padding:16px 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:16.5px}
.pd-faq summary::-webkit-details-marker{display:none}
.pd-faq summary::after{content:"+";color:#0f9d4b;font-weight:800;font-size:22px}
.pd-faq details[open] summary::after{content:"–"}
.pd-faq details p{margin:0 0 18px;color:#3a424a;line-height:1.7}
.post-body h2{font-size:22px;font-weight:800;color:#15202a;margin-top:40px}
