:root{
  --ink:#0b0b0b;
  --paper:#fff;
  --muted:#6f6f6f;
  --line:#dedede;
  --soft:#f5f5f5;
  --accent:#111;
  --green:#77b82a;
  --header-h:80px;
  --max:1480px;
  --shadow:0 18px 48px rgba(0,0,0,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;}
button,input,textarea{font:inherit}
button{cursor:pointer}
.container{width:min(var(--max),calc(100% - 48px));margin-inline:auto}
.section{padding:50px 0}
.section-tight{padding:52px 0}
.section-title{font-size:40px;line-height:1.15;text-align:center;font-weight:500;margin:0 0 42px;letter-spacing:-.02em}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.25em;text-transform:uppercase;margin-bottom:10px}
.lead{font-size:18px;color:#444}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid #111;background:#111;color:#fff;min-height:44px;padding:0 24px;border-radius:0;transition:.25s ease}
.btn:hover{background:#fff;color:#111;transform:translateY(-2px)}
.btn-light{background:#fff;color:#111}
.btn-pill{border-radius:999px}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:700}
.link-arrow::after{content:'→';transition:transform .25s ease}
.link-arrow:hover::after{transform:translateX(5px)}

/* Header */
.site-header{position:sticky;top:0;z-index:1000;height:var(--header-h);background:#fff;border-bottom:1px solid #dcdcdc;transition:background .3s ease,box-shadow .3s ease,color .3s ease}
.home-page .site-header{position:fixed;left:0;right:0;background:rgba(0,0,0,.12);border-bottom-color:rgba(255,255,255,.24);color:#fff}
.home-page .site-header.scrolled{background:#fff;color:#111;box-shadow:0 4px 24px rgba(0,0,0,.08);border-bottom-color:#ddd}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;font-size:31px;font-weight:900;letter-spacing:-.08em;white-space:nowrap}
.brand span{display:inline-block;-webkit-text-stroke:1.4px #243474;text-shadow:0 1px 0 #fff}
.brand .w{color:#f04d34}.brand .e{color:#ff713b}.brand .i{color:#32b5ff}.brand .l{color:#ffee21}.brand .d{color:#79cf2d}.brand .a{color:#f3da16}
.main-nav{display:flex;align-items:center;gap:40px;height:100%}
.main-nav>a,.nav-item>a{position:relative;font-size:18px;text-transform:uppercase;height:100%;display:flex;align-items:center;white-space:nowrap}
.main-nav a::after{content:'';position:absolute;left:50%;right:50%;bottom:24px;height:1px;background:currentColor;transition:.25s ease}
.main-nav a:hover::after,.main-nav a.active::after{left:0;right:0}
.header-tools{display:flex;align-items:center;gap:9px;font-size:21px}
.icon-btn{width:38px;height:38px;border:0;background:transparent;color:inherit;display:grid;place-items:center;border-radius:50%}
.icon-btn:hover{background:rgba(120,120,120,.12)}
.nav-item{height:100%;position:relative}
.mega-menu{
  position:fixed;
  top:var(--header-h);
  left:0;
  right:0;
  width:100vw;
  max-width:none;
  transform:translateY(8px);
  background:rgba(20,20,20,.88);
  color:#fff;
  padding:15px 18px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:28px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:.25s ease;
  box-shadow:var(--shadow);
  box-sizing:border-box;
  z-index:999;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.nav-item:hover .mega-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.mega-menu a{position:relative;font-size:13px;white-space:nowrap;padding:7px 2px;border-bottom:0}
.mega-menu a:hover{border-color:transparent}


/* 子菜单短下划线：只保留一条，并固定在文字下方 */
.mega-menu a::after{
  bottom:0 !important;
}

.menu-toggle{display:none}

/* Hero */
.hero{height:min(920px,calc(72vh + 200px));min-height:720px;position:relative;overflow:hidden;background:#000;color:#fff}
.hero-track,.hero-slide{position:absolute;inset:0}
.hero-slide{opacity:0;visibility:hidden;transition:opacity .75s ease,visibility .75s ease;background-position:center;background-size:cover}
.hero-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.48),rgba(0,0,0,.05) 55%,rgba(0,0,0,.08))}
.hero-slide.active{opacity:1;visibility:visible}
.hero-content{position:absolute;z-index:2;left:max(24px,calc((100% - var(--max))/2));top:50%;transform:translateY(-44%);max-width:800px}
.hero-content h1{font-size:60px;line-height:.95;margin:0 0 18px;letter-spacing:-.045em}
.hero-content p{font-size:25px;margin:0;max-width:480px}
.hero-dots{position:absolute;z-index:5;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:8px}
.hero-dot{width:11px;height:11px;border-radius:50%;border:0;background:#fff;opacity:.9;padding:0}
.hero-dot.active{background:var(--green)}
.hero-slide.is-baked .hero-content{display:none}

/* Breadcrumb */
.breadcrumb{background:#f4f4f4;font-size:14px;padding:9px 0;color:#333}

/* cards */
.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:24px}
.category-card{position:relative;text-align:center;min-width:0}
.category-thumb{aspect-ratio:1.2/1;background:#f7f7f7;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
.category-thumb img{width:100%;height:100%;object-fit:contain;transition:transform .35s ease,filter .35s ease}
.category-card:hover img{transform:scale(1.05)}
.category-card h3{font-size:14px;font-weight:500;margin:12px 0 0}
.category-card .hover-layer{position:absolute;inset:0;background:rgba(0,0,0,.72);color:#fff;display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:.3s ease}
.category-card:hover .hover-layer{opacity:1}
.hover-layer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.hover-layer a{font-size:13px}
.hover-layer a:hover{text-decoration:underline}
.subcategory-row{display:grid;grid-template-columns:repeat(5,1fr);gap:28px;margin-top:54px}
.subcategory-card{text-align:center;transition:transform .28s ease}
.subcategory-card:hover{transform:translateY(-5px)}
.subcategory-card img{aspect-ratio:1.15/1;object-fit:contain;width:100%}
.subcategory-card span{display:block;margin-top:8px;font-size:14px}

/* Manufacturing / split sections */
.wide-story{position:relative;min-height:300px;background-size:cover;background-position:center;display:flex;align-items:center;color:#fff;overflow:hidden}
.wide-story::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.58),rgba(0,0,0,.08))}
.wide-story .container{position:relative;z-index:1}
.wide-story h2{font-size:clamp(36px,5vw,62px);line-height:1;margin:0;max-width:420px}
.process-layout{display:grid;grid-template-columns:320px 1fr;gap:38px;align-items:stretch}
.process-list{position:relative;padding-left:28px}
.process-list::before{content:'';position:absolute;left:9px;top:14px;bottom:14px;width:1px;background:#d7d7d7}
.process-step{position:relative;display:flex;align-items:center;gap:15px;border:0;background:none;width:100%;padding:10px 0;text-align:left;color:#666;transition:.2s}
.process-step::before{content:'';position:absolute;left:-27px;width:14px;height:14px;border:2px solid #aaa;background:#fff;border-radius:50%}
.process-step.active{color:#111;font-weight:700;font-size:18px;}
.process-step.active::before{background:#fff;border-color:#111}

.process-image{min-height:430px;overflow:hidden;background:#eee;position:relative}
.process-image img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:opacity .3s ease,transform .5s ease}
.process-image.switching img{opacity:.15;transform:scale(1.025)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split.reverse .split-media{order:-1}
.split-media{overflow:hidden;min-height:360px;background:#eee}
.split-media img{width:100%;height:100%;object-fit:cover}
.split-copy h2{font-size:34px;margin:0 0 18px;line-height:1.1}
.split-copy p{color:#444}
.feature-list{list-style:none;padding:0;margin:35px 0 0;display:grid;gap:12px}
.feature-list li{position:relative;padding-left:28px;color:#555}
.feature-list li::before{content:'';position:absolute;left:0;color:#111}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);background:#f4f4f4}
.stat{padding:34px 20px;text-align:center;border-right:1px solid #ddd}
.stat:last-child{border-right:0}
.stat strong{display:block;font-size:70px;line-height:1;letter-spacing:-.01em}
.stat small{display:block;margin-top:18px;color:#555}

/* Logos / sustainability */
.sustainability{text-align:center}
.logo-strip{max-width:900px;margin:28px auto 0}
.logo-strip img{width:100%}
.client-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.client-card{height:94px;background:#fff;border:1px solid #e1e1e1;display:grid;place-items:center;text-align:center;font-family:Georgia,serif;font-size:20px;transition:.25s ease}
.client-card:hover{background:#111;color:#fff;transform:translateY(-3px)}
.client-card.is-extra{display:none}
.client-grid.expanded .client-card.is-extra{display:grid}
.certificate-marquee{overflow:hidden;position:relative;padding:12px 0}
.certificate-track{display:flex;width:max-content;gap:28px;animation:certMove 20s linear infinite}
.certificate-track img{height:190px;width:auto;max-width:none;border:1px solid #eee;background:white}
.certificate-marquee:hover .certificate-track{animation-play-state:paused}
@keyframes certMove{to{transform:translateX(calc(-50% - 14px))}}

/* About */
.about-intro{display:grid;grid-template-columns:1fr 1fr;min-height:500px;background:#fff}
.about-copy{padding:5px max(30px,calc((100vw - var(--max))/2));padding-right:58px;display:flex;flex-direction:column;justify-content:center}
.about-copy h1{font-size:42px;margin:0 0 22px}
.about-photo{min-height:500px}
.about-photo img{width:100%;height:100%;object-fit:cover}
.highlights{background:#f3f3f3;padding:34px 0}
.highlight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.highlight-item{padding:18px 30px;border-bottom:1px solid #cfcfcf}
.highlight-item strong{font-size:28px;display:block}
.highlight-item span{font-size:13px;color:#555}
.detail-row{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;margin-bottom:26px}
.detail-row:nth-child(even) .detail-media{order:-1}
.detail-media{border-radius:0px;overflow:hidden;min-height:340px;background:#eee}
.detail-media img{width:100%;height:100%;object-fit:cover}
.detail-copy h2{font-size:30px;margin-top:0}
.full-photo-title{text-align:center;font-size:30px;margin:0 0 20px}
.full-photo{height:360px;overflow:hidden}
.full-photo img{width:100%;height:100%;object-fit:cover}

/* Why */
.why-hero{padding-top:44px}
.why-hero h1{font-size:50px;line-height:1;margin:8px 0 28px}
.why-hero-image{height:600px;overflow:hidden}
.why-hero-image img{width:100%;height:100%;object-fit:cover}

/* products */
.page-hero{height:430px;background-size:cover;background-position:center;position:relative;color:#fff;display:flex;align-items:flex-end}
.page-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),rgba(0,0,0,.02) 65%)}
.page-hero .container{position:relative;z-index:2;padding-bottom:38px}
.page-hero h1{font-size:48px;margin:0}
.product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:44px 50px}
.product-card{background:#fff;border:0;text-align:center;padding:0;transition:transform .25s ease}
.product-card:hover{transform:translateY(-4px)}
.product-card img{width:100%;height:220px;object-fit:contain;background:#fff}
.product-card h3{font-size:16px;margin:12px 0 4px;font-weight:500}
.product-card .model{font-size:12px;color:#888;text-transform:uppercase;letter-spacing:.08em}
.pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:62px}
.pagination button,.pagination a{min-width:34px;height:34px;border:1px solid #111;background:#fff;display:grid;place-items:center;border-radius:50%}
.pagination .active{background:#111;color:#fff}

/* Modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:2000;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:.35s ease;backdrop-filter:blur(3px)}
.modal-backdrop.open{opacity:1;visibility:visible}
.modal{width:min(700px,100%);background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:34px 48px 28px;transform:translateY(20px) scale(.98);transition:.35s ease;position:relative}
.modal-backdrop.open .modal{transform:none}
.modal-close{position:absolute;right:16px;top:10px;width:34px;height:34px;border:0;background:none;font-size:22px}
.modal h2{font-size:24px;margin:0 0 4px}
.modal p{color:#666;margin:0 0 15px}
.line-form{display:grid;gap:8px}
.line-field{border:0;border-bottom:1px solid #ccc;padding:10px 0;outline:none;background:transparent;width:100%}
.line-field:focus{border-color:#111}
textarea.line-field{min-height:84px;resize:vertical}
.line-form .btn{margin:8px auto 0;min-width:160px;border-radius:999px}

/* News */
.news-list{max-width:1040px;margin:auto;display:grid;gap:30px}
.news-row{display:grid;grid-template-columns:1fr 1.05fr;background:#f5f5f5;min-height:250px;overflow:hidden}
.news-row img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.news-row:hover img{transform:scale(1.03)}
.news-copy{padding:28px 36px}
.news-copy h2{font-size:24px;margin:0 0 8px;border-bottom:1px solid #333;padding-bottom:8px}
.news-copy p{font-size:14px}
.news-copy time{display:block;margin-top:32px;font-size:12px}
.news-row.is-extra{display:none}
.news-list.expanded .news-row.is-extra{display:grid}

/* Contact */
.contact-main{padding:44px 0 30px}
.contact-top{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:start}
.contact-copy h1{font-size:30px;line-height:1.05;margin:18px 0 30px;max-width:480px}
.contact-copy ul{list-style:none;padding:0;display:grid;gap:8px;margin:0 0 30px}
.contact-copy li::before{content:'•';font-weight:900;margin-right:3px}
.contact-box{border:1px solid #111;padding:28px 42px}
.contact-box .btn{width:100%;border-radius:999px;min-height:38px}
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin:42px 0 32px}
.contact-card{background:#f7f7f7;padding:26px 26px;min-height:165px;transition:transform .25s ease,box-shadow .25s ease}
.contact-card:hover{transform:scale(1.025);box-shadow:0 10px 30px rgba(0,0,0,.09)}
.contact-icon{font-size:40px;line-height:1;margin-bottom:14px}
.contact-card h3{margin:0 0 8px;font-size:24px}
.contact-card p{font-size:18px;margin:3px 0}
.contact-flex{display:flex;gap:24px;align-items:center;justify-content:space-between}
.contact-qr{width:90px;flex:0 0 90px}
.contact-map{display:block;overflow:hidden;position:relative;background:#eee}
.contact-map img{width:100%;height:auto;transition:transform .35s ease}
.contact-map:hover img{transform:scale(1.02)}
.contact-map::after{content:'Open map ↗';position:absolute;right:18px;bottom:16px;background:#111;color:#fff;padding:8px 13px;font-size:18px}

/* footer */
.site-footer{background:#050505;color:#fff;margin-top:0}
.footer-main{display:grid;grid-template-columns:1.05fr .7fr 1.7fr;gap:54px;padding:58px 0 40px}
.footer-brand .brand{font-size:35px;margin-bottom:18px}.footer-brand .brand span{-webkit-text-stroke:1px #fff;color:transparent!important;text-shadow:none}
.footer-brand p{font-size:16px;margin:8px 0;color:#eee}
.socials{display:flex;gap:10px;margin:18px 0}.socials a{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:12px}
.qrs{display:flex;gap:22px;margin-top:18px}.qr-item{text-align:center;font-size:11px}.qr-item img{width:90px;height:90px;object-fit:cover;background:white}
.footer-nav{border-left:1px solid #444;padding-left:52px;display:grid;align-content:start;gap:8px;font-size:13px;text-transform:uppercase}
.footer-form{border-left:1px solid #444;padding-left:52px}
.footer-form-title{font-style:italic;text-transform:uppercase;font-size:13px;margin-bottom:14px}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 34px}.footer-grid textarea{grid-column:1/-1}
.footer-input{width:100%;background:transparent;color:#fff;border:1px solid #fff;padding:12px 10px;font-size:12px;outline:none;border-radius:0}.footer-input::placeholder{color:#fff;text-transform:uppercase;font-style:italic;opacity:.95}
.footer-submit{margin-top:16px;border:1px solid #fff;background:transparent;color:#fff;border-radius:999px;padding:8px 24px;font-size:12px}
.footer-submit:hover{background:#fff;color:#111}
.footer-bottom{border-top:1px solid #333;text-align:center;padding:19px 0;font-size:12px}

/* floating */
.floating-tools{position:fixed;right:18px;bottom:72px;z-index:900;display:grid;gap:8px}
.float-btn{width:44px;height:44px;border:0;border-radius:50%;background:#aaa;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.2);display:grid;place-items:center;font-size:18px;transition:.2s}
.float-btn:hover{background:#111;transform:translateY(-2px)}
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);background:#111;color:#fff;padding:11px 18px;border-radius:999px;z-index:3000;opacity:0;pointer-events:none;transition:.3s}.toast.show{opacity:1;transform:translate(-50%,0)}

/* reveal animations */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.65,.3,1),transform .8s cubic-bezier(.2,.65,.3,1)}
[data-reveal="left"]{transform:translateX(-48px)}
[data-reveal="right"]{transform:translateX(48px)}
[data-reveal="fade"]{transform:none}
[data-reveal].revealed{opacity:1;transform:none; }

@media (max-width:1100px){
  .main-nav{gap:24px}.category-grid{grid-template-columns:repeat(3,1fr)}.product-grid{grid-template-columns:repeat(4,1fr)}
  .footer-main{grid-template-columns:1fr 1fr}.footer-form{grid-column:1/-1;border-left:0;border-top:1px solid #333;padding:35px 0 0}.footer-nav{padding-left:30px}
}
@media (max-width:820px){
  :root{--header-h:62px}.container{width:min(100% - 32px,var(--max))}.section{padding:56px 0}.section-title{font-size:29px;margin-bottom:30px}
  .site-header,.home-page .site-header{position:fixed;left:0;right:0;background:#fff;color:#111;border-bottom:1px solid #ddd}.home-page .site-header:not(.scrolled){background:rgba(0,0,0,.28);color:#fff;border-color:rgba(255,255,255,.25)}
  .brand{font-size:27px}.main-nav{position:fixed;inset:var(--header-h) 0 auto 0;background:#fff;color:#111;display:block;height:auto;padding:14px 24px 28px;transform:translateY(-130%);transition:.35s ease;box-shadow:0 18px 35px rgba(0,0,0,.12);z-index:-1}.main-nav.open{transform:none}.main-nav>a,.nav-item>a{height:48px;border-bottom:1px solid #eee}.main-nav a::after{display:none}.nav-item{height:auto}.mega-menu{position:static;transform:none!important;width:auto;background:#f5f5f5;color:#111;opacity:1;visibility:visible;pointer-events:auto;display:none;box-shadow:none;padding:8px 16px;margin-bottom:8px;flex-wrap:wrap;justify-content:flex-start}.nav-item.sub-open .mega-menu{display:flex}.header-tools{gap:8px}.menu-toggle{display:grid}.search-btn{display:none}
  .hero{min-height:520px;height:76vh}.hero-content{left:24px;right:24px}.hero-content h1{font-size:46px}.hero-content p{font-size:16px}.hero-slide{background-position:center}.hero-slide.is-baked{background-position:62% center}.hero-slide.is-baked::after{background:rgba(0,0,0,.1)}
  .category-grid{grid-template-columns:repeat(2,1fr);gap:22px 16px}.category-card h3{font-size:13px}.subcategory-row{grid-template-columns:repeat(2,1fr);gap:22px 18px}.subcategory-row .subcategory-card:last-child{grid-column:1/-1;width:50%;justify-self:center}
  .process-layout{grid-template-columns:1fr}.process-list{display:flex;gap:12px;overflow-x:auto;padding:0 0 8px}.process-list::before{display:none}.process-step{width:auto;min-width:max-content;border:1px solid #ddd;padding:8px 12px}.process-step::before{display:none}.process-step.active{background:#111;color:#fff;border-color:#111}.process-image{min-height:320px}
  .split,.detail-row,.about-intro,.contact-top{grid-template-columns:1fr;gap:28px}.split.reverse .split-media,.detail-row:nth-child(even) .detail-media{order:0}.split-media,.detail-media{min-height:200px}.about-copy{padding:42px 24px}.about-photo{min-height:360px}.highlight-grid{grid-template-columns:1fr 1fr}.stats-grid{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid #ddd}.client-grid{grid-template-columns:repeat(3,1fr)}
  .why-hero{padding-top:92px}.why-hero h1{font-size:42px}.why-hero-image{height:330px}.page-hero{height:380px;margin-top:var(--header-h)}
  .product-grid{grid-template-columns:repeat(2,1fr);gap:34px 20px}.product-card img{height:200px}
  .news-row{grid-template-columns:1fr}.news-row img{height:240px}.news-copy{padding:24px}.news-copy time{margin-top:18px}
  .contact-main{padding-top:98px}.contact-cards{grid-template-columns:1fr}.contact-box{padding:24px}.contact-map{min-height:300px}.contact-map img{height:300px;object-fit:cover}
  .footer-main{grid-template-columns:1fr;gap:34px}.footer-nav,.footer-form{border-left:0;border-top:1px solid #333;padding:30px 0 0}.footer-grid{grid-template-columns:1fr}.footer-grid textarea{grid-column:auto}.floating-tools{right:12px;bottom:20px}.float-btn{width:40px;height:40px}
}
@media (max-width:520px){
  body{font-size:15px}.container{width:calc(100% - 28px)}.hero{min-height:480px}.hero-content h1{font-size:39px}.category-grid{gap:20px 12px}.category-thumb{aspect-ratio:1/1}.subcategory-row .subcategory-card:last-child{width:100%}.stats-grid{grid-template-columns:1fr 1fr}.stat{padding:26px 10px}.stat strong{font-size:34px}.client-grid{grid-template-columns:repeat(2,1fr)}.client-card{height:78px;font-size:17px}.highlight-grid{grid-template-columns:1fr}.product-grid{grid-template-columns:1fr 1fr}.product-card img{height:155px}.modal{padding:32px 22px 24px;border-radius:18px}.footer-main{padding-top:42px}.qrs{gap:14px}.about-copy h1{font-size:34px}.page-hero h1{font-size:38px}.contact-copy h1{font-size:27px}.contact-flex{align-items:flex-start}.contact-qr{width:76px;flex-basis:76px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1!important;transform:none!important}
}
/* ===== HOME PAGE: PRODUCT CATEGORIES ===== */
.home-category-section .container{
  max-width:1100px;
}

.home-category-section .section-title{
  margin-bottom:26px;
  font-size:40px;
  font-weight:500;
  letter-spacing:.02em;
}

.home-category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  max-width:1014px;
  margin:0 auto;
}

.home-category-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  min-width:0;
  min-height:150px;
  padding:12px 10px 10px;
  background:#f2f2f2;
  text-align:center;
  transition:transform .28s ease,box-shadow .28s ease;
  isolation:isolate;
}

.home-category-card.is-dark{
  background:#8d8d8d;
}

.home-category-thumb{
  position:relative;
  z-index:1;
  width:100%;
  height:112px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.home-category-thumb img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:104px;
  object-fit:contain;
  transition:transform .35s ease;
}

.home-category-card h3{
  position:relative;
  z-index:3;
  margin:6px 0 0;
  color:#222;
  font-size:11px;
  line-height:1.2;
  font-weight:500;
  transition:color .28s ease;
}

/* PC：黑色半透明层覆盖整个卡片（图片 + 标题区域） */
@media (min-width:1025px){
  .home-category-card::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:rgba(0,0,0,.45);
    opacity:0;
    pointer-events:none;
    transition:opacity .28s ease;
  }

  .home-category-card:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 24px rgba(0,0,0,.10);
  }

  .home-category-card:hover::after{
    opacity:1;
  }

  .home-category-card:hover h3{
	font-weight:bold;
  }

  .home-category-card:hover .home-category-thumb img{
    transform:scale(1.04);
  }
}

/* 1920px 等大屏：单个分类卡片 330 x 330 */
@media (min-width:1600px){
  .home-category-grid{
    grid-template-columns:repeat(3,330px);
    width:max-content;
    max-width:none;
    margin:0 auto;
  }

  .home-category-card{
    width:330px;
    height:330px;
    min-height:330px;
    padding:18px 16px 14px;
  }

  .home-category-thumb{
    height:274px;
  }

  .home-category-thumb img{
    max-height:264px;
  }

  .home-category-card h3{
    margin-top:8px;
    font-size:18px;
  }
}

@media (max-width:1024px){
  .home-category-section .container{
    max-width:100%;
  }

  .home-category-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-width:680px;
  }
}

@media (max-width:520px){
  .home-category-grid{
    gap:12px;
  }

  .home-category-card{
    min-height:156px;
  }
}


/* ===== HOME PAGE: OUR CLIENTS ===== */
.home-clients-section .container{
  max-width:1760px;
}

.home-clients-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
}

.home-client-card,
.home-client-feature{
  position:relative;
  overflow:hidden;
  min-width:0;
  min-height:188px;
  box-shadow: 5px 5px 5px rgba(0,0,0,0.15);
  padding:8px 10px;
  border:1px solid #e5e5e5;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    color .28s ease,
    background-color .28s ease,
    box-shadow .28s ease;
}

.home-client-feature{
  grid-column:3 / span 2;
  flex-direction:column;
  gap:8px;
}

.home-client-feature h2{
  margin:0;
  font-size:40px;
  line-height:1;
  font-weight:500;
  letter-spacing:.02em;
  transition:color .28s ease;
}

.home-client-feature p{
  margin:0;
  color:#555;
  font-size:18px;
  line-height:1.45;
  transition:color .28s ease;
}

.home-client-card span,
.home-client-card strong,
.home-client-card small{
  display:block;
}

.brand-sans{
  font-family:Arial,Helvetica,sans-serif;
  font-size:20px;
  font-weight:500;
  letter-spacing:.04em;
}

.brand-serif{
  font-family:Georgia,"Times New Roman",serif;
  font-size:18px;
  letter-spacing:.08em;
}

.brand-script{
  font-family:"Brush Script MT",cursive;
  font-size:32px;
  letter-spacing:0;
}

.spaced{
  letter-spacing:.14em;
}

.small-lines{
  line-height:1.1;
}

.small-lines small{
  margin-top:2px;
  font-size:10px;
  letter-spacing:.16em;
}

.icon-stack{
  flex-direction:column;
  gap:6px;
}

.icon-stack > span{
  font-size:24px;
  line-height:1;
  font-weight:700;
  letter-spacing:0;
}

.icon-stack strong{
  font-size:14px;
  letter-spacing:.08em;
}

.home-clients-cta{
  margin-top:18px;
  text-align:center;
}

.home-clients-cta .btn{
  min-width:100px;
  padding:8px 16px;
  border-color:#111;
  background:#111;
  color:#fff;
  font-size:14px;
}

.home-clients-cta .btn:hover{
  background:#000;
  color:#fff;
}

/*
  PC hover：整块变成黑色半透明效果。
  这里使用 inset box-shadow，因此蒙版在文字/Logo后面，
  不会把文字盖住；同时文字切换为白色。
*/
@media (min-width:1025px){
  .home-client-card:hover,
  .home-client-feature:hover{
    color:#fff;
    transform:translateY(-2px);
    box-shadow:
      inset 0 0 0 9999px rgba(0,0,0,.42),
      0 8px 18px rgba(0,0,0,.10);
  }

  .home-client-feature:hover h2,
  .home-client-feature:hover p{
    color:#fff;
  }
}

@media (max-width:1024px){
  .home-clients-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .home-client-feature{
    grid-column:2 / span 2;
  }
}

@media (max-width:767px){
  .home-clients-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .home-client-feature{
    grid-column:1 / -1;
    order:7;
    min-height:110px;
  }

  .home-client-card,
  .home-client-feature{
    min-height:82px;
  }

  .brand-sans{
    font-size:16px;
  }

  .brand-serif{
    font-size:15px;
  }

  .brand-script{
    font-size:26px;
  }
}


/* ===== LEAN PRODUCTION SLIDER ===== */
.lean-slider{
  position:relative !important;
  overflow:hidden !important;
  background:#f5f5f5;
}

.lean-slides{
  position:relative;
  width:100%;
  height:100%;
  min-height:inherit;
}

.lean-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .5s ease,visibility .5s ease;
}

.lean-slide.active{
  position:relative;
  opacity:1;
  visibility:visible;
}

.lean-slide img{
  display:block;
  width:100%;
  height:100%;
  min-height:320px;
  object-fit:cover;
}

.lean-arrow{
  position:absolute;
  top:50%;
  z-index:20;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:rgba(0,0,0,.45);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  line-height:1;
  cursor:pointer;
  transform:translateY(-50%);
  transition:background .25s ease,transform .25s ease;
}

.lean-arrow:hover{
  background:rgba(0,0,0,.72);
}

.lean-prev{
  left:18px;
}

.lean-next{
  right:18px;
}

.lean-dots{
  position:absolute;
  left:50%;
  bottom:16px;
  z-index:20;
  display:flex;
  align-items:center;
  gap:9px;
  transform:translateX(-50%);
}

.lean-dot{
  width:10px;
  height:10px;
  padding:0;
  border:1px solid rgba(255,255,255,.95);
  border-radius:50%;
  background:rgba(255,255,255,.45);
  cursor:pointer;
  transition:background .25s ease,transform .25s ease;
}

.lean-dot.active{
  background:#fff;
  transform:scale(1.18);
}

@media (max-width:1024px){
  .lean-slide img{
    min-height:320px;
  }

  .lean-arrow{
    width:38px;
    height:38px;
    font-size:26px;
  }
}

@media (max-width:767px){
  .lean-slide img{
    min-height:260px;
  }

  .lean-arrow{
    width:36px;
    height:36px;
  }

  .lean-prev{
    left:10px;
  }

  .lean-next{
    right:10px;
  }

  .lean-dots{
    bottom:12px;
  }
}


/* ===== SUSTAINABILITY GRID ===== */
.sustainability-list-section .container{
  max-width:1040px;
}

.sustainability-list-section .muted{
  max-width:900px;
  margin:-22px auto 34px;
  text-align:center;
  font-size:18px;
}

.sustainability-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.sustainability-card{
  position:relative;
  overflow:hidden;
  aspect-ratio:1.48 / 1;
  border:2px solid #3e952c;
  background:#fff;
  border-radius:25px;
}

.sustainability-card img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .35s ease;
}

@media (min-width:1025px){
  .sustainability-card::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:3;
    background:#000;
    opacity:0;
    pointer-events:none;
    transition:opacity .28s ease;
  }

  .sustainability-card:hover::after{
    opacity:.38;
  }

  .sustainability-card:hover img{
    transform:scale(1.035);
  }
}

@media (max-width:1024px){
  .sustainability-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:520px){
  .sustainability-grid{
    gap:10px;
  }

  .sustainability-list-section .muted{
    margin-top:-14px;
    margin-bottom:24px;
  }
}

/* ===== OUR CLIENTS: View more 默认隐藏第4行 =====
   .home-client-card 本身使用 display:flex，
   所以显式覆盖带 hidden 属性的新增客户项，避免浏览器初次加载时被显示出来。
*/
.home-client-extra[hidden]{
  display:none !important;
}



.process-step2{position:relative;display:flex;align-items:center;gap:15px;border:0;background:none;width:100%;padding:10px 0;text-align:left;color:#666;transition:.2s}
.process-step2::before{content:'';position:absolute;left:-27px;width:14px;height:14px;border:1px solid #aaa;background:#fff;border-radius:50%}

.process-step2.active2{color:#111;font-weight:700;font-size:25px;}
.process-step2.active2::before{background:#111;border-color:#111}


/* =========================================================
   ABOUT PHOTO SLIDER
   ========================================================= */

.about-photo-slider {
  position: relative;
  overflow: hidden;
}


/* =========================================================
   TRACK
   ========================================================= */

.about-photo-track {
  position: relative;

  width: 100%;
  height: 100%;
}


/* =========================================================
   SLIDE
   ========================================================= */

.about-photo-slide {
  position: absolute;

  inset: 0;

  width: 100%;
  height: 100%;

  opacity: 0;

  transform: scale(1.035);

  transition:
    opacity 0.65s ease,
    transform 1.2s ease;

  pointer-events: none;
}


/* 当前图片 */

.about-photo-slide.active {
  position: relative;

  opacity: 1;

  transform: scale(1);

  pointer-events: auto;
}


/* =========================================================
   IMAGE
   ========================================================= */

.about-photo-slide img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  user-select: none;

  -webkit-user-drag: none;
}


/* =========================================================
   ARROWS
   ========================================================= */

.about-photo-arrow {
  position: absolute;

  top: 50%;

  width: 48px;
  height: 48px;

  margin-top: -24px;

  padding: 0;

  border: 0;

  border-radius: 50%;

  background: rgba(255, 255, 255, .90);

  display: flex;

  align-items: center;
  justify-content: center;

  cursor: pointer;

  z-index: 10;

  opacity: .85;

  transition:
    opacity .25s ease,
    background .25s ease,
    transform .25s ease;
}


/* SVG */

.about-photo-arrow svg {
  width: 22px;
  height: 22px;

  fill: none;

  stroke: #333;

  stroke-width: 1.8;

  stroke-linecap: round;
  stroke-linejoin: round;
}


/* LEFT */

.about-photo-prev {
  left: 20px;
}


/* RIGHT */

.about-photo-next {
  right: 20px;
}


/* PC hover */

@media (hover: hover) and (pointer: fine) {

  .about-photo-arrow:hover {

    opacity: 1;

    background: #fff;

    transform: scale(1.08);

  }

}


/* =========================================================
   DOTS
   ========================================================= */

.about-photo-dots {
  position: absolute;

  left: 50%;
  bottom: 18px;

  transform: translateX(-50%);

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 9px;

  z-index: 10;
}


/* NORMAL DOT */

.about-photo-dot {
  display: block;

  width: 8px;
  height: 8px;

  margin: 0;

  padding: 0;

  border: 0;

  border-radius: 50%;

  background: rgba(255, 255, 255, .55);

  cursor: pointer;

  transition:
    width .3s ease,
    background .3s ease;
}


/* ACTIVE DOT */

.about-photo-dot.active {
  width: 26px;

  border-radius: 10px;

  background: #fff;
}


/* =========================================================
   TABLET
   ========================================================= */

@media screen and (max-width: 1024px) {

  .about-photo-arrow {

    width: 44px;
    height: 44px;

    margin-top: -22px;

  }


  .about-photo-prev {

    left: 14px;

  }


  .about-photo-next {

    right: 14px;

  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media screen and (max-width: 749px) {

  .about-photo-arrow {

    width: 42px;
    height: 42px;

    margin-top: -21px;

  }


  .about-photo-prev {

    left: 10px;

  }


  .about-photo-next {

    right: 10px;

  }


  .about-photo-arrow svg {

    width: 20px;
    height: 20px;

  }


  .about-photo-dots {

    bottom: 12px;

  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .about-photo-slide {

    transition: none;

    transform: none;

  }

}


/* =========================================================
   PRODUCT CATEGORY LINKAGE
   上方大类 + 下方对应独立组
========================================================= */

.product-linkage-section {
  overflow: hidden;
}


/* =========================================================
   第一行：大分类
========================================================= */

.product-main-scroll {
  width: 100%;

  overflow-x: auto;
  overflow-y: hidden;

  margin-top: 38px;
  margin-bottom: 55px;

  scrollbar-width: none;

  -webkit-overflow-scrolling: touch;
}


.product-main-scroll::-webkit-scrollbar {
  display: none;
}


.product-main-list {
  display: grid;

  grid-template-columns:
    repeat(6, minmax(0, 1fr));

  gap: 24px;

  width: 100%;
}


.product-main-item {
  appearance: none;

  min-width: 0;

  margin: 0;

  padding: 0 0 15px;

  border: 0;

  border-bottom:
    2px solid transparent;

  background: transparent;

  color: #111;

  font: inherit;

  cursor: pointer;

  text-align: center;

  transition:
    border-color .3s ease,
    transform .35s ease;
}


.product-main-image {
  position: relative;

  width: 100%;

  aspect-ratio: 1 / 1;

  overflow: hidden;

  background: #f3f3f3;
}


.product-main-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition:
    transform .5s ease,
    opacity .35s ease;
}


.product-main-item h3 {
  margin: 15px 0 0;

  font-size: 16px;

  line-height: 1.35;

  font-weight: 500;
}


/* 当前大类 */

.product-main-item.active {
  border-bottom-color: #111;
}


.product-main-item.active h3 {
  font-weight: 600;
}



@media (hover:hover) and (pointer:fine) {

  .product-main-item:hover {
    transform: translateY(-4px);
  }


  .product-main-item:hover
  .product-main-image img {
    transform: scale(1.035);
  }

}



/* =========================================================
   第二层整体
========================================================= */

.product-sub-master {
  position: relative;

  width: 100%;

  padding: 0;
}


/* =========================================================
   外部Viewport
   一次只看到一个完整GROUP
========================================================= */

.product-group-viewport {
  width: 100%;

  overflow: hidden;
}


/* =========================================================
   里面实际上有6个GROUP
========================================================= */

.product-group-track {
  display: flex;

  align-items: flex-start;

  width: 100%;

  transform: translate3d(0,0,0);

  transition:
    transform .65s cubic-bezier(.22,.61,.36,1);

  will-change: transform;
}


/* =========================================================
   每个大类都有一个独立完整块
========================================================= */

.product-sub-group {
  flex: 0 0 100%;

  width: 100%;

  min-width: 100%;

  padding: 0 1px;

  opacity: .45;

  transition:
    opacity .45s ease;
}


.product-sub-group.is-current {
  opacity: 1;
}


/* =========================================================
   二级分类标题
========================================================= */

.product-sub-header {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  margin-bottom: 22px;
}


.product-sub-header h3 {
  margin: 0;

  font-size: 24px;

  line-height: 1.3;

  font-weight: 500;
}


.product-view-all {
  color: #111;

  font-size: 13px;

  line-height: 1;

  text-decoration: none;

  padding-bottom: 4px;

  border-bottom:
    1px solid #111;
}



/* =========================================================
   内部二级分类滑动器
========================================================= */

.product-sub-slider {
  position: relative;

  width: 100%;
}


/* =========================================================
   内部Viewport
========================================================= */

.product-sub-viewport {
  width: 100%;

  overflow-x: auto;
  overflow-y: hidden;

  scrollbar-width: none;

  -webkit-overflow-scrolling: touch;

  scroll-behavior: smooth;
}


.product-sub-viewport::-webkit-scrollbar {
  display: none;
}


/* =========================================================
   子分类横向排列
========================================================= */

.product-sub-track {
  display: flex;

  flex-wrap: nowrap;

  align-items: flex-start;

  gap: 28px;

  width: max-content;

  min-width: 100%;
}



/* =========================================================
   子分类卡片
========================================================= */

.product-sub-card {
  flex:
    0 0
    calc((100% - 112px) / 5);

  width:
    calc((100% - 112px) / 5);

  min-width: 200px;

  max-width: 255px;

  color: #111;

  text-decoration: none;

  text-align: center;
}


.product-sub-image {
  position: relative;

  width: 100%;

  aspect-ratio: 1 / 1;

  overflow: hidden;

  background: #f3f3f3;
}


.product-sub-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition:
    transform .45s ease,
    opacity .4s ease;
}


.product-sub-card span {
  display: block;

  margin-top: 14px;

  font-size: 15px;

  line-height: 1.4;

  font-weight: 400;
}



@media (hover:hover) and (pointer:fine) {

  .product-sub-card:hover
  .product-sub-image img {
    transform: scale(1.035);
  }

}



/* =========================================================
   Sketch / Color
========================================================= */

.product-sub-image.thumb-swap {
  position: relative;
}


.product-sub-image.thumb-swap img {
  position: absolute;

  inset: 0;
}


.product-sub-image .thumb-color {
  opacity: 0;
}


.product-sub-card:hover
.thumb-color {
  opacity: 1;
}


.product-sub-card:hover
.thumb-sketch {
  opacity: 0;
}



/* =========================================================
   内部二级分类左右箭头
========================================================= */

.product-sub-arrow {
  position: absolute;

  top: 44%;

  z-index: 30;

  width: 44px;
  height: 44px;

  margin-top: -22px;

  padding: 0;

  border: 0;

  border-radius: 50%;

  background:
    rgba(255,255,255,.94);

  box-shadow:
    0 2px 12px
    rgba(0,0,0,.12);

  display: flex;

  align-items: center;
  justify-content: center;

  cursor: pointer;

  transition:
    opacity .25s ease,
    transform .25s ease;
}


.product-sub-prev {
  left: 8px;
}


.product-sub-next {
  right: 8px;
}


.product-sub-arrow svg {
  width: 21px;
  height: 21px;

  fill: none;

  stroke: #333;

  stroke-width: 1.8;

  stroke-linecap: round;

  stroke-linejoin: round;
}


.product-sub-arrow:disabled {
  opacity: .18;

  cursor: default;
}



@media (hover:hover) and (pointer:fine) {

  .product-sub-arrow:not(:disabled):hover {
    transform: scale(1.08);
  }

}



/* =========================================================
   整个大GROUP左右箭头
========================================================= */

.product-group-arrow {
  position: absolute;

  top: 28px;

  z-index: 40;

  width: 38px;
  height: 38px;

  padding: 0;

  border: 1px solid #ddd;

  border-radius: 50%;

  background: #fff;

  display: none;

  align-items: center;
  justify-content: center;

  cursor: pointer;
}


.product-group-prev {
  right: 48px;
}


.product-group-next {
  right: 2px;
}


.product-group-arrow svg {
  width: 18px;
  height: 18px;

  fill: none;

  stroke: #333;

  stroke-width: 1.8;

  stroke-linecap: round;

  stroke-linejoin: round;
}


.product-group-arrow:disabled {
  opacity: .25;

  cursor: default;
}



/* =========================================================
   TABLET
========================================================= */

@media screen and (max-width: 1024px) {


  .product-main-list {
    gap: 18px;
  }


  .product-main-item h3 {
    font-size: 14px;
  }


  .product-sub-track {
    gap: 22px;
  }


  .product-sub-card {
    flex: 0 0 220px;

    width: 220px;

    min-width: 220px;
  }


}



/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 749px) {


  .product-main-scroll {
    width: calc(100% + 20px);

    margin-top: 25px;

    margin-bottom: 38px;
  }


  .product-main-list {
    display: flex;

    width: max-content;

    min-width: 100%;

    gap: 13px;

    padding-right: 20px;
  }


  .product-main-item {
    flex: 0 0 128px;

    width: 128px;

    padding-bottom: 10px;
  }


  .product-main-item h3 {
    margin-top: 9px;

    font-size: 13px;
  }



  /* GROUP标题 */

  .product-sub-header {
    margin-bottom: 16px;

    padding-right: 4px;
  }


  .product-sub-header h3 {
    font-size: 20px;
  }


  .product-view-all {
    font-size: 12px;
  }



  /* 二级分类 */

  .product-sub-viewport {
    width: 100%;

    padding: 0 42px;
  }


  .product-sub-track {
    gap: 15px;
  }


  .product-sub-card {
    flex: 0 0 72%;

    width: 72%;

    min-width: 72%;

    max-width: none;
  }


  .product-sub-card span {
    margin-top: 10px;

    font-size: 14px;
  }



  /* 箭头 */

  .product-sub-arrow {
    width: 40px;
    height: 40px;

    margin-top: -20px;

    box-shadow: none;

    background:
      rgba(255,255,255,.88);
  }


  .product-sub-prev {
    left: 0;
  }


  .product-sub-next {
    right: 0;
  }


}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width: 400px) {


  .product-main-item {
    flex-basis: 116px;

    width: 116px;
  }


  .product-sub-card {
    flex-basis: 78%;

    width: 78%;

    min-width: 78%;
  }


}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {


  .product-group-track {
    transition: none;
  }


  .product-main-item,
  .product-main-image img,
  .product-sub-image img {
    transition: none;
  }


}