@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+Thai:wght@400;500;600;700;800&display=swap');

:root{--ink:#141518;--steel:#6e7178;--gold:#d68b18;--gold2:#f2ae38;--paper:#f6f5f2;--line:#e3e2de;--white:#fff;--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans Thai','DM Sans',sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.wrap{max-width:1240px;margin:auto;padding:0 28px}.topbar{background:#202329;color:#f5f5f5;font-size:.78rem}.topbar .wrap{height:34px;display:flex;justify-content:flex-end;align-items:center;gap:18px}.topbar a{color:#fff}.nav{height:86px;background:#fff;display:flex;align-items:center;border-bottom:1px solid #ecebe8;position:sticky;top:0;z-index:10}.nav .wrap{width:100%;display:flex;align-items:center;gap:32px}.brand{width:220px;height:70px;overflow:hidden;background:#050505;display:flex;align-items:center}.brand img{width:100%;height:100%;object-fit:contain}.navlinks{display:flex;align-items:center;gap:26px;margin-left:auto;font:600 .9rem 'DM Sans','Noto Sans Thai',sans-serif}.navlinks a{white-space:nowrap}.navlinks a:hover,.navlinks a.active{color:var(--gold)}.quote{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#fff;padding:13px 18px;border-radius:7px;font-weight:800;box-shadow:0 8px 16px #d68b1830;white-space:nowrap}.phone{font:700 .9rem 'DM Sans',sans-serif;color:#9b630b;border:1px solid var(--gold);padding:11px 14px;border-radius:7px;white-space:nowrap}.menu{display:none;border:0;background:none;font-size:1.5rem}.hero{min-height:540px;color:#fff;background:#131416 url('assets/hero-pump.png') center/cover no-repeat;position:relative;isolation:isolate;display:flex;align-items:center}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101215 0%,#101215ed 37%,#10121575 66%,#10121525 100%);z-index:-1}.eyebrow{font:600 .75rem 'DM Sans';letter-spacing:.22em;color:var(--gold2);text-transform:uppercase}.hero h1{font-size:clamp(2.45rem,5vw,4.7rem);line-height:1.08;margin:18px 0;max-width:680px;font-weight:800}.hero h1 span{color:var(--gold2)}.hero p{font-size:1.08rem;line-height:1.7;max-width:560px;color:#e7e7e7}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.button{display:inline-flex;gap:10px;align-items:center;justify-content:center;border:1px solid var(--gold);border-radius:7px;padding:13px 19px;font-weight:800}.button.primary{background:var(--gold);color:#fff}.button.ghost{color:#fff}.trust{display:flex;flex-wrap:wrap;gap:22px;margin-top:33px;font-size:.88rem;color:#e2e2e2}.trust b{color:var(--gold2);margin-right:6px}.section{padding:82px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:29px}.section h2{margin:7px 0 0;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.2}.muted{color:#65666a;line-height:1.7}.chooser{background:#fff;border-radius:16px;padding:24px;display:grid;grid-template-columns:1.2fr repeat(3,1fr) 1.05fr;gap:14px;box-shadow:0 14px 40px #2222;margin-top:-58px;position:relative;z-index:3}.chooser-intro h2{font-size:2rem;margin:0}.chooser-intro p{margin:5px 0;color:#686a70}.choice{border:1px solid var(--line);border-radius:12px;padding:16px;background:#fff;min-height:120px;display:flex;flex-direction:column;justify-content:end;font-size:1rem;font-weight:800;position:relative;overflow:hidden}.choice:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,#15151516),url('assets/pump-catalog.png') center/cover;opacity:.24}.choice span{z-index:1}.choice.fire:before{background-position:100% 100%}.choice.water:before{background-position:0 0}.choice.waste:before{background-position:0 100%}.choice-icon{font-size:1.5rem}.chooser .button{align-self:center}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:#fff;border-radius:16px;overflow:hidden}.benefit{padding:25px;border-right:1px solid var(--line);display:flex;gap:15px;align-items:start}.benefit:last-child{border:0}.benefit i{color:var(--gold);font-size:1.8rem;font-style:normal}.benefit h3{margin:0 0 5px;font-size:1rem}.benefit p{font-size:.86rem;margin:0;color:#65666a;line-height:1.55}.dark{background:#17191e;color:#fff}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.2s}.card:hover{transform:translateY(-4px);box-shadow:0 15px 30px #24242414}.product-img{height:185px;background:#f0f0ef url('assets/pump-catalog.png') 0 0/200% 200% no-repeat}.product-img.multi{background-position:100% 0}.product-img.sub{background-position:0 100%}.product-img.fire{background-position:100% 100%}.card-body{padding:17px}.card h3{font-size:1.1rem;margin:0 0 6px}.card p{font-size:.86rem;color:#686a70;margin:0;line-height:1.55}.arrow{float:right;color:var(--gold);font-size:1.2rem}.cta-band{background:linear-gradient(110deg,#191b20,#38302a);color:#fff;padding:38px 0}.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}.cta-band h2{margin:0;font-size:1.7rem}.page-hero{padding:68px 0 58px;background:#1d2026;color:#fff}.page-hero h1{font-size:clamp(2.3rem,4vw,3.7rem);margin:11px 0}.page-hero p{color:#d6d6d6;max-width:620px;line-height:1.7}.filterbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:27px}.filter{border:1px solid var(--line);background:#fff;border-radius:99px;padding:10px 15px;font-size:.88rem}.filter.active{background:var(--ink);color:#fff;border-color:var(--ink)}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.product-grid .product-img{height:235px}.specs{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.specs span{font-size:.72rem;background:#f2f0ec;padding:5px 8px;border-radius:3px;color:#62646a}.article-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px}.article{min-height:315px;background:#272a30 url('assets/hero-pump.png') center/cover;border-radius:14px;position:relative;overflow:hidden;color:white;display:flex;align-items:end;padding:24px}.article:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,#111d)}.article > div{z-index:1}.article h3{font-size:1.35rem;line-height:1.35;margin:8px 0}.article.small{min-height:315px;background-position:70% center}.article.small:nth-child(3){background-image:linear-gradient(135deg,#b67213,#222);}.tag{font:700 .72rem 'DM Sans';letter-spacing:.1em;color:#ffc561;text-transform:uppercase}.contact-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:32px}.contact-box{background:#1d2026;color:#fff;border-radius:16px;padding:38px}.contact-box h2{margin-top:0}.contact-line{padding:18px 0;border-bottom:1px solid #ffffff25}.contact-line small{display:block;color:#b8b8b8;margin-bottom:4px}.form{background:#fff;border:1px solid var(--line);border-radius:16px;padding:34px}.form h2{margin-top:0}.field{margin:16px 0}.field label{font-weight:700;font-size:.9rem;display:block;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;border:1px solid #d8d7d4;border-radius:6px;padding:12px;font:inherit;background:#fff}.field textarea{height:120px;resize:vertical}.footer{background:#121417;color:#cfd0d1;padding:50px 0 22px}.footergrid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:25px}.footer .brand{margin-bottom:14px}.footer h3{color:#fff;margin:4px 0 14px;font-size:1rem}.footer a{display:block;margin:8px 0;font-size:.88rem}.copyright{border-top:1px solid #ffffff18;margin-top:35px;padding-top:18px;font-size:.78rem;color:#999}
@media(max-width:980px){.navlinks,.phone{display:none}.menu{display:block;margin-left:auto}.nav .wrap{gap:12px}.cards{grid-template-columns:repeat(2,1fr)}.chooser{grid-template-columns:1fr 1fr}.chooser-intro{grid-column:span 2}.benefits{grid-template-columns:1fr}.benefit{border-right:0;border-bottom:1px solid var(--line)}.product-grid{grid-template-columns:repeat(2,1fr)}.article-grid{grid-template-columns:1fr 1fr}.article:first-child{grid-column:span 2}.footergrid{grid-template-columns:1fr 1fr}.contact-layout{grid-template-columns:1fr}}
@media(max-width:620px){.wrap{padding:0 18px}.topbar .wrap{justify-content:center}.nav{height:72px}.brand{width:174px;height:58px}.hero{min-height:620px;align-items:start;padding-top:64px;background-position:63% center}.hero:after{background:linear-gradient(90deg,#101215ef,#101215c0,#10121570)}.hero h1{font-size:2.55rem}.hero p{font-size:.98rem}.chooser{margin-top:-25px;padding:16px;grid-template-columns:1fr}.chooser-intro{grid-column:auto}.choice{min-height:90px}.section{padding:55px 0}.section-head{align-items:start;display:block}.section-head .button{margin-top:16px}.cards,.product-grid,.article-grid{grid-template-columns:1fr}.article:first-child{grid-column:auto}.article{min-height:260px}.cta-band .wrap{align-items:start;flex-direction:column}.footergrid{grid-template-columns:1fr}.page-hero{padding:48px 0}.contact-box,.form{padding:24px}.actions .button{width:100%}}

/* Refined brand lockup: keep the original lion mark, with a crisp text wordmark. */
.brand{width:216px;height:58px;overflow:visible;background:transparent;display:flex;align-items:center;gap:10px}
.brand img{display:none}
.brand:before{content:"";width:50px;height:50px;flex:0 0 50px;background:#111 url('assets/treesing-mark.jpg') center top/cover no-repeat;border-radius:12px;box-shadow:inset 0 0 0 1px #d68b1850}
.brand:after{content:"TREESING\A ENGINEERING & SUPPLY";white-space:pre;line-height:1.05;color:#1b1c20;font:800 .95rem/1.05 'DM Sans','Noto Sans Thai',sans-serif;letter-spacing:.025em}
.footer .brand:after{color:#fff}
.hero{background-image:url('assets/hero-pump.png');background-position:center}.hero>.wrap{width:100%;padding-left:clamp(28px,7vw,88px);padding-right:28px}.chooser{grid-template-columns:1.25fr repeat(5,1fr)}.choice:before{background:#edf0f2 center/contain no-repeat;opacity:.34}.choice.pump:before{background-image:url('assets/products/jwtech/pump-mitsubishi-02.jpg')}.choice.cctv:before{background-image:url('assets/products/jwtech/hikvision-02.png')}.choice.network:before{background-image:url('assets/products/jwtech/zyxel-02.jpg')}.choice.motor:before{background-image:url('assets/products/jwtech/mitsubishi-motor-02.jpg')}.choice.gear:before{background-image:url('assets/products/jwtech/sew-02.jpg')}.cards{grid-template-columns:repeat(5,1fr)}.product-img{background:#f1f2f2}.product-img img{width:100%;height:100%;object-fit:contain;padding:16px}
.choice{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.choice:before{transition:opacity .2s ease,transform .25s ease}.choice-popover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:#17191ee8;color:#fff;font-size:.9rem;font-weight:800;opacity:0;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease;z-index:2}.choice-popover b{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--gold);color:#fff;font-size:1rem}.choice:hover,.choice:focus-visible{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 14px 25px #1415181f}.choice:hover:before,.choice:focus-visible:before{opacity:.18;transform:scale(1.04)}.choice:hover .choice-popover,.choice:focus-visible .choice-popover{opacity:1;transform:translateY(0)}
@media(max-width:980px){.chooser{grid-template-columns:1fr 1fr}.chooser-intro{grid-column:span 2}.cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.chooser{grid-template-columns:1fr}.chooser-intro{grid-column:auto}.cards{grid-template-columns:1fr}}
@media(max-width:620px){.brand{width:192px}.brand:before{width:44px;height:44px;flex-basis:44px}.brand:after{font-size:.84rem}}
@media(max-width:620px){.choice-popover{inset:auto 10px 10px auto;opacity:1;transform:none;background:#17191ef0;border-radius:4px;padding:7px 9px;font-size:.75rem}.choice-popover b{width:22px;height:22px;font-size:.8rem}.choice{padding-right:122px}.choice:hover{transform:none}}
