/* Yiying: product-led manufacturing brand, November 2026. */
:root{--yy-ink:var(--primary-dark);--yy-green:var(--primary-color);--yy-accent:var(--primary-hover);--yy-pale:var(--brand-surface);--yy-muted:#52685e;--yy-line:var(--brand-line);--yy-white:#fff;--yy-radius:8px;--yy-header:76px}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{color:var(--yy-ink);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;word-break:normal;overflow-wrap:break-word}
h1,h2,h3,h4{font-family:inherit;text-wrap:balance}
p{ text-wrap:pretty }
a,button,input,textarea{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,video:focus-visible{outline:3px solid var(--yy-green);outline-offset:5px}
.yy-wrap{width:calc(100% - 96px);max-width:1240px;margin-inline:auto}
.yy-skip-link{position:fixed;top:8px;left:8px;transform:translateY(-180%);z-index:130;padding:10px 18px;background:var(--yy-ink);color:#fff}
.yy-skip-link:focus{transform:none}
.yy-header{height:var(--yy-header);background:#fff;box-shadow:none;border-bottom:1px solid var(--yy-line);z-index:100;transform:none!important}
.yy-header>.yy-wrap{height:100%}
.yy-header .nav{gap:28px}
.yy-header .logo{flex-shrink:0}
.yy-header .logo img{width:194px;height:auto;max-height:54px;object-fit:contain}
.yy-header .nav-menu{display:flex;align-items:center;gap:6px;margin:0 0 0 auto}
.yy-header .nav-menu>li{padding:0;margin:0;background:none}
.yy-header .nav-menu li a{font-size:14px;font-weight:500;color:var(--yy-ink);text-transform:none;padding:13px 10px;gap:7px}
.yy-header .nav-menu li a:is(:hover,:focus-visible),.yy-header .nav-menu a[aria-current="page"],.yy-header .nav-menu>li:has(.submenu [aria-current="page"])>a{background:var(--primary-light);color:var(--yy-green)}
.yy-header .nav-menu>li>a{border-radius:4px}
.yy-header .nav-menu .submenu{z-index:110;left:0;min-width:230px;border:1px solid var(--yy-line);box-shadow:none;border-radius:0;max-width:300px;white-space:normal}
.yy-header .nav-menu .submenu li a{padding:10px 18px;font-size:14px}
.yy-header .has-submenu:focus-within>.submenu{opacity:1;visibility:visible;transform:none}
.yy-header .yy-nav-overview a{font-weight:700!important;border-bottom:1px solid var(--yy-line)}
.yy-header-contact{display:inline-flex;align-items:center;gap:22px;white-space:nowrap;flex-shrink:0;padding:12px 18px;background:var(--yy-green);color:white;font-size:13px;border-radius:50px;transition:background-color .2s ease}
.yy-header-contact:is(:hover,:focus-visible,:active){background:var(--yy-accent)}
.yy-header .nav-toggle{display:none;background:transparent;color:var(--yy-ink);padding:10px;cursor:pointer}
.mobile-overlay{z-index:90}
.yy-button{display:inline-flex;align-items:center;justify-content:center;gap:32px;min-height:50px;padding:14px 24px;background:var(--yy-green);color:white;font-size:14px;font-weight:600;line-height:1.5;cursor:pointer;border:0;border-radius:3px;transition:background .2s ease,transform .2s ease}
.yy-button:is(:hover,:focus-visible,:active){background:var(--yy-accent)}
.yy-button:hover{transform:translateY(-2px)}
.yy-button span,.yy-text-link span{font-size:20px;line-height:1}
.yy-text-link{display:inline-flex;align-items:center;gap:20px;font-size:14px;font-weight:600;color:var(--yy-green);padding-block:9px;text-decoration:none}
.yy-text-link:hover{text-decoration:underline;text-underline-offset:5px}
.yy-hero{margin-top:var(--yy-header);padding:64px 0 42px;background:#f5f8f5}
.yy-hero-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:54px;align-items:center}
.yy-company-name{font-size:13px;letter-spacing:.04em;color:var(--yy-green);margin:0 0 25px}
.yy-company-name span{display:inline-block;margin-left:14px;padding-left:14px;border-left:1px solid #c4d7ca;letter-spacing:0;color:var(--yy-muted)}
.yy-hero h1{font-size:clamp(34px,3.8vw,56px);font-weight:650;line-height:1.28;letter-spacing:-.025em;margin:0;color:var(--yy-ink);white-space:normal}
.yy-hero h1 span{color:var(--yy-green)}
.yy-hero-english{font-size:14px;line-height:1.6;color:var(--yy-muted);margin:18px 0 25px}
.yy-hero-summary{font-size:16px;line-height:1.9;color:#415a4d;margin:0 0 28px}
.yy-actions{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.yy-hero-note{font-size:12px;color:var(--yy-muted);margin:32px 0 0}
.yy-hero-visual{min-width:0}
.yy-factory-photo{position:relative;margin:0;background:#e1ebe6;overflow:hidden}
.yy-factory-photo>img{display:block;width:100%;height:390px;object-fit:cover;object-position:center}
.yy-factory-photo figcaption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:10px;align-items:center;background:var(--yy-ink);color:#fff;padding:17px 20px;font-size:12px}
.yy-factory-photo figcaption a{font-weight:600;white-space:nowrap}
.yy-factory-photo figcaption a:hover{text-decoration:underline}
.yy-product-strip{display:flex;align-items:center;gap:8px;padding:15px 12px;margin:0;background:#fff}
.yy-product-strip img{height:84px;width:22%;object-fit:contain;mix-blend-mode:multiply}
.yy-product-strip p{margin:0 0 0 8px;font-size:11px;line-height:1.9;color:var(--yy-muted);white-space:nowrap}
.yy-product-strip strong{font-weight:600;color:var(--yy-ink)}
.yy-intro{display:grid;grid-template-columns:.9fr 1.1fr;gap:85px;padding-block:88px}
.yy-section-label{font-size:14px;color:var(--yy-green);margin:0 0 15px;font-weight:600}
.yy-intro h2,.yy-section-heading h2,.yy-manufacturing h2,.yy-contact h2{font-size:clamp(27px,2.6vw,38px);line-height:1.4;font-weight:600;letter-spacing:-.02em;margin:0 0 20px;color:var(--yy-ink)}
.yy-intro-body{padding-top:5px;color:var(--yy-muted);font-size:15px;line-height:2.05}
.yy-intro-body p{margin:0 0 18px}
.yy-intro-body p:last-child{margin-bottom:0}
.yy-fields{padding:78px 0 86px;background:var(--yy-pale)}
.yy-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:24px}
.yy-section-heading h2{margin:0 0 12px}
.yy-section-heading p{color:var(--yy-muted);font-size:15px;line-height:1.9;margin:0}
.yy-section-heading>.yy-text-link{flex-shrink:0;margin-bottom:4px}
.yy-production-note{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--yy-green);margin:0 0 32px}
.yy-production-note>span{width:6px;height:6px;border-radius:50%;background:var(--yy-green);flex-shrink:0}
.yy-field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 28px}
.yy-field{display:block;min-width:0}
.yy-field-image{position:relative;overflow:hidden;background:white;aspect-ratio:1.4;padding:20px}
.yy-field-image>img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .35s ease}
.yy-field:hover .yy-field-image>img{transform:scale(1.045)}
.yy-field-arrow{position:absolute;right:15px;bottom:14px;width:33px;height:33px;display:flex;justify-content:center;align-items:center;background:var(--yy-pale);color:var(--yy-green);font-size:21px;border-radius:50%;transition:background .2s,color .2s}
.yy-field:hover .yy-field-arrow{background:var(--yy-green);color:#fff}
.yy-field-name{margin-top:17px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.yy-field-name h3{font-size:21px;font-weight:600;margin:0;color:var(--yy-ink)}
.yy-field-name p{font-size:11px;margin:0;color:var(--yy-muted)}
.yy-field-description{font-size:13px;line-height:1.9;color:var(--yy-muted);margin:9px 0 0;max-width:38em}
.yy-manufacturing{background:var(--yy-ink);color:white;padding:82px 0}
.yy-manufacturing-layout{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:70px}
.yy-manufacturing h2{color:#fff;margin-bottom:20px}
.yy-manufacturing-copy>p{color:#d0e2d8;font-size:14px;line-height:1.95;max-width:40em}
.yy-capabilities{margin:26px 0}
.yy-capabilities>div{display:grid;grid-template-columns:94px 1fr;gap:12px;padding:15px 0;border-top:1px solid #42665a;font-size:13px;line-height:1.7}
.yy-capabilities dt{font-weight:600;color:#fff}
.yy-capabilities dd{margin:0;color:#d0e2d8}
.yy-light-link{font-size:14px;display:inline-flex;gap:30px;align-items:center;color:white;border-bottom:1px solid #82ad98;padding-bottom:7px}
.yy-factory-video{margin:0;min-width:0}
.yy-factory-video video{display:block;width:100%;aspect-ratio:1.25;object-fit:cover;background:#0c2820}
.yy-factory-video figcaption{display:flex;justify-content:space-between;gap:15px;font-size:12px;margin-top:14px;color:white}
.yy-factory-video figcaption span{color:#c8dbcf}
.yy-process{padding-block:85px 92px}
.yy-process .yy-section-heading{margin-bottom:42px}
.yy-process-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:0;list-style:none;margin:0;gap:30px}
.yy-process-list li{border-top:1px solid var(--yy-line);padding:20px 0 0;position:relative}
.yy-process-list li>span{font-size:13px;color:var(--yy-green);font-weight:600}
.yy-process-list h3{font-size:18px;margin:18px 0 10px;font-weight:600}
.yy-process-list p{font-size:13px;color:var(--yy-muted);line-height:1.9;margin:0}
.yy-contact{background:var(--primary-light);padding:68px 0}
.yy-contact-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:85px}
.yy-contact h2{margin:0 0 18px}
.yy-contact-copy>p{font-size:14px;line-height:1.9;color:var(--yy-muted);margin:0 0 26px}
.yy-contact-email{font-size:18px;display:flex;align-items:center;gap:25px;font-weight:600;width:fit-content}
.yy-contact-phone{display:inline-block;font-size:14px;margin-top:7px;color:var(--yy-green)}
.yy-enquiry{padding-top:7px}
.yy-enquiry label{display:block;font-size:13px;font-weight:600;margin-bottom:9px}
.yy-enquiry input,.yy-enquiry textarea{display:block;width:100%;padding:13px 14px;background:#fff;border:1px solid #b7ccbf;border-radius:3px;font-family:inherit;font-size:14px;color:var(--yy-ink);line-height:1.6}
.yy-enquiry input::placeholder,.yy-enquiry textarea::placeholder{color:#657b6d;opacity:1}
.yy-enquiry textarea{resize:vertical;min-height:110px}
.yy-form-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px}
.yy-form-bottom{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-top:20px}
.yy-form-bottom p{font-size:11px;color:var(--yy-muted);margin:0}
.yy-form-bottom .yy-button{gap:30px;min-height:46px;padding:12px 20px}
.yy-footer{background:#fff;padding:45px 0 20px;color:var(--yy-ink)}
.yy-footer-top{display:flex;justify-content:space-between;gap:40px;padding-bottom:35px}
.yy-footer-brand{font-size:26px;font-weight:700;display:inline-flex;align-items:baseline;gap:12px}
.yy-footer-brand span{font-size:12px;letter-spacing:.12em}
.yy-footer-top p{font-size:13px;margin:10px 0 0;color:var(--yy-muted)}
.yy-footer-top p.yy-footer-address{font-size:11px;margin-top:13px}
.yy-footer-nav{display:flex;gap:27px;align-items:flex-start;padding-top:12px;font-size:13px}
.yy-footer-nav a:hover,.yy-footer-bottom a:hover{text-decoration:underline}
.yy-footer-bottom{border-top:1px solid var(--yy-line);padding-top:18px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;color:var(--yy-muted)}
.yy-footer-bottom p{margin:0}
.yy-footer-bottom>div{display:flex;gap:22px;flex-wrap:wrap}
.yy-image-filters { position: absolute; pointer-events: none; }
.yy-field-image > img,
.product-image-container > .product-image,
.product-thumbnail img,
.recommended-product-thumbnail img { filter: url(#yy-thumbnail-white); }
.product-thumbnail-wrapper,
.product-thumbnail,
.recommended-product-thumbnail { background-color: #fff; }
.yy-product-status{font-size:13px;color:var(--yy-green);padding:10px 14px;background:var(--yy-pale);display:inline-block;margin:10px 0 22px}
.company-position-en{font-size:15px!important;color:var(--yy-green);line-height:1.7!important}
.company-product-fields{margin:30px 0}
.company-product-fields dt{font-size:19px;font-weight:600;padding-top:18px;border-top:1px solid var(--yy-line);margin-top:20px;color:var(--yy-ink)}
.company-product-fields dd{font-size:15px;line-height:1.9;color:var(--yy-muted);margin:9px 0 0}
.article-content-wrapper h2{font-size:25px;margin:32px 0 17px;line-height:1.5;color:var(--yy-ink)}
.article-content-wrapper p{font-size:15px;line-height:2;color:var(--yy-muted)}
.yy-pagination{display:flex;gap:22px;justify-content:center;align-items:center;padding:40px 0;font-size:14px}
.yy-pagination a{padding:10px 18px;border:1px solid var(--yy-line);color:var(--yy-green)}
.yy-pagination a:hover{background:var(--yy-pale)}
@media(min-width:1025px) and (max-width:1200px){.yy-wrap{width:calc(100% - 64px)}.yy-header .logo img{width:158px}.yy-header .nav{gap:14px}.yy-header .nav-menu{gap:0}.yy-header .nav-menu li a{font-size:13px;padding-inline:8px}.yy-header-contact{padding-inline:12px;font-size:12px;gap:10px}.yy-hero-layout{gap:32px}.yy-hero h1{font-size:43px}.yy-product-strip p{font-size:10px;margin-left:0}.yy-intro,.yy-contact-layout{gap:50px}}
@media(max-width:1024px){
 .yy-wrap{width:calc(100% - 48px)}
 .yy-header .nav{gap:20px}.yy-header .logo img{width:180px}.yy-header .nav-toggle{display:block;margin-left:0;z-index:125;font-size:22px}.yy-header-contact{margin-left:auto}
 .yy-header .nav-menu{position:fixed;top:var(--yy-header);right:0;left:auto;height:calc(100dvh - var(--yy-header));width:min(360px,90vw);padding:25px;background:#fff;display:block;overflow-y:auto;transform:translateX(105%);visibility:hidden;transition:transform .25s ease,visibility .25s;z-index:120;margin:0;box-shadow:none;max-height:none}
 .yy-header .nav-menu.active{transform:none;visibility:visible}.yy-header .nav-menu>li{margin:0;border-bottom:1px solid var(--yy-line);border-radius:0}.yy-header .nav-menu>li>a{font-size:16px;padding:16px 5px;justify-content:space-between}
 .yy-header .nav-menu .submenu{position:static;border:0;padding:0 0 10px;margin:0;max-height:0;min-width:0;max-width:none;overflow:hidden;opacity:1;visibility:visible;transform:none;display:none;box-shadow:none}
 .yy-header .has-submenu.open>.submenu{max-height:750px;display:block}.yy-header .nav-menu .submenu li a{padding:11px 12px;font-size:14px}
 .yy-header .has-submenu:hover>.submenu:not(.open){transform:none}
 .yy-hero{padding-top:45px}.yy-hero-layout{gap:28px;grid-template-columns:1fr 1fr}.yy-company-name{font-size:11px}.yy-company-name span{margin-left:8px;padding-left:8px}.yy-hero h1{font-size:36px}.yy-hero-english{font-size:12px}.yy-hero-summary{font-size:14px}.yy-hero .yy-button{font-size:12px;gap:20px;padding-inline:16px}.yy-actions{gap:10px}.yy-hero .yy-text-link{font-size:12px;gap:12px}.yy-factory-photo>img{height:350px}.yy-factory-photo figcaption{padding:14px 12px;font-size:10px}.yy-product-strip{padding:12px 5px}.yy-product-strip img{height:65px;width:23%}.yy-product-strip p{font-size:9px;margin:0}.yy-hero-note{font-size:11px}
 .yy-intro{gap:40px;padding-block:65px}.yy-intro-body{font-size:14px}.yy-field-grid{gap:30px 20px}.yy-field-name h3{font-size:19px}.yy-field-description{font-size:12px}.yy-field-name p{font-size:10px}.yy-manufacturing-layout{gap:35px}.yy-capabilities>div{grid-template-columns:80px 1fr}.yy-contact-layout{gap:45px}.yy-process-list{gap:20px}.yy-process-list h3{font-size:16px}.yy-process-list p{font-size:12px}.yy-form-bottom{align-items:flex-start;flex-direction:column}.yy-footer-nav{gap:18px;flex-wrap:wrap}
}
@media(max-width:700px){
 :root{--yy-header:68px}.yy-wrap{width:calc(100% - 40px)}.yy-header .nav{gap:12px}.yy-header .logo img{width:157px}.yy-header-contact{font-size:11px;padding:10px 12px;gap:8px}.yy-header .nav-toggle{font-size:19px;padding:7px}.yy-header .nav-menu{top:68px;height:calc(100dvh - 68px)}
 .yy-hero{padding-top:34px;padding-bottom:30px}.yy-hero-layout{grid-template-columns:1fr;gap:32px}.yy-company-name{font-size:11px;margin-bottom:20px}.yy-hero h1{font-size:clamp(31px,7.8vw,48px);letter-spacing:-.035em}.yy-hero-english{font-size:12px;margin:16px 0 20px}.yy-hero-summary{font-size:14px;margin-bottom:23px}.yy-desktop-break{display:none}.yy-actions{gap:22px}.yy-hero .yy-button{font-size:13px;padding:13px 17px;gap:24px;min-height:48px}.yy-hero .yy-text-link{font-size:13px}.yy-hero-note{margin-top:24px}.yy-factory-photo>img{height:290px}.yy-factory-photo figcaption{font-size:11px;padding:14px}.yy-product-strip{padding:12px 8px}.yy-product-strip img{width:22%;height:70px}.yy-product-strip p{font-size:10px}
 .yy-intro{grid-template-columns:1fr;gap:24px;padding-block:54px}.yy-intro h2,.yy-section-heading h2,.yy-manufacturing h2,.yy-contact h2{font-size:28px}.yy-intro-heading .yy-text-link{padding-block:4px}.yy-intro-body{font-size:14px;line-height:1.95}.yy-fields{padding-block:52px}.yy-section-heading{display:block;margin-bottom:15px}.yy-section-heading>.yy-text-link{margin-top:14px}.yy-section-heading p{font-size:14px}.yy-production-note{font-size:11px;line-height:1.8;align-items:baseline;margin-bottom:26px}.yy-field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 16px}.yy-field-image{aspect-ratio:1.05;padding:14px}.yy-field-arrow{width:27px;height:27px;font-size:18px;right:10px;bottom:10px}.yy-field-name{margin-top:13px;gap:3px;display:block}.yy-field-name h3{font-size:17px;line-height:1.5}.yy-field-name p{font-size:9px;line-height:1.6;margin-top:4px}.yy-field-description{font-size:11px;line-height:1.8;margin-top:8px}
 .yy-manufacturing{padding-block:54px}.yy-manufacturing-layout{grid-template-columns:1fr;gap:35px}.yy-manufacturing-copy>p{font-size:14px}.yy-capabilities>div{grid-template-columns:90px 1fr}.yy-factory-video video{aspect-ratio:1.4}.yy-factory-video figcaption{font-size:11px}.yy-process{padding-block:54px}.yy-process .yy-section-heading{margin-bottom:25px}.yy-process-list{grid-template-columns:1fr;gap:0}.yy-process-list li{display:grid;grid-template-columns:32px 100px 1fr;gap:12px;padding:19px 0;align-items:baseline}.yy-process-list li>span{font-size:12px}.yy-process-list h3{margin:0;font-size:16px;text-wrap:initial}.yy-process-list p{font-size:12px;line-height:1.8}
 .yy-contact{padding-block:48px}.yy-contact-layout{grid-template-columns:1fr;gap:35px}.yy-contact-copy>p{font-size:13px}.yy-contact-email{font-size:17px}.yy-form-pair{gap:14px}.yy-enquiry input,.yy-enquiry textarea{font-size:16px;padding:11px 12px}.yy-form-bottom{flex-direction:row;align-items:center;gap:15px}.yy-form-bottom p{font-size:10px;max-width:120px}.yy-form-bottom .yy-button{font-size:12px;gap:20px;white-space:nowrap}
 .yy-footer{padding-top:32px}.yy-footer-top{flex-direction:column;gap:22px;padding-bottom:27px}.yy-footer-nav{padding:0;font-size:12px;gap:23px}.yy-footer-top p{font-size:12px}.yy-footer-bottom{align-items:flex-start;flex-direction:column;gap:10px;font-size:10px}.yy-footer-bottom>div{gap:15px}.company-product-fields dt{font-size:18px}.company-product-fields dd{font-size:14px}.article-content-wrapper h2{font-size:22px}.yy-product-status{font-size:11px}.yy-pagination{gap:14px;font-size:12px}.yy-pagination a{padding:10px 12px}
}
@media(max-width:360px){.yy-header .logo img{width:135px}.yy-header-contact{font-size:10px;padding-inline:9px}.yy-header .nav{gap:8px}.yy-hero h1{font-size:29px}.yy-process-list li{grid-template-columns:26px 92px 1fr;gap:8px}.yy-actions{gap:14px}.yy-form-pair{grid-template-columns:1fr}.yy-form-bottom{flex-direction:column;align-items:flex-start}.yy-form-bottom p{max-width:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important}.yy-field:hover .yy-field-image>img,.yy-button:hover{transform:none}}
@media(max-width:360px){.yy-header-contact{display:none}.yy-header .logo img{width:157px}.yy-header .nav-toggle{margin-left:auto}}