:root{--ink:#1d211d;--muted:#686d65;--cream:#f3efe6;--paper:#fbfaf6;--sage:#778271;--line:#d9d5ca;--white:#fff;--max:1280px;--radius:2px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);line-height:1.55}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{width:min(calc(100% - 48px),var(--max));margin:auto}.skip-link{position:fixed;left:12px;top:-50px;background:#fff;padding:10px;z-index:100}.skip-link:focus{top:12px}.announcement{background:var(--ink);color:#e9e7df;text-align:center;padding:8px 20px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.site-header{position:sticky;top:0;z-index:20;background:rgba(251,250,246,.94);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:.25s}.site-header.scrolled{border-color:var(--line);box-shadow:0 8px 28px rgba(29,33,29,.06)}.header-inner{min-height:82px;display:flex;align-items:center;gap:34px}.brand{display:flex;align-items:center;gap:12px;margin-right:auto}.brand span:last-child{display:flex;flex-direction:column}.brand strong{font-size:13px;letter-spacing:.13em}.brand small{font-size:10px;color:var(--muted);letter-spacing:.05em}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--ink);font-size:9px}.primary-nav{display:flex;gap:18px;font-size:13px;white-space:nowrap}.primary-nav a{position:relative}.primary-nav a:after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:1px;background:var(--ink);transition:.2s}.primary-nav a:hover:after,.primary-nav a[aria-current="page"]:after{width:100%}.menu-toggle{display:none;border:0;background:none}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border:1px solid transparent;text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:700;cursor:pointer}.button-dark{background:var(--ink);color:#fff}.button-light{background:#fff;color:var(--ink)}.hero{min-height:720px;position:relative;display:flex;align-items:center;color:#fff;overflow:hidden}.hero-media{position:absolute;inset:0;background:#8a8e85}.hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#6e756b,#b0a897)}.asset-placeholder{position:relative;display:grid;place-items:center;min-height:240px;background:linear-gradient(135deg,#d9d5ca,#bdb8ac);overflow:hidden}.asset-placeholder:before{content:"";position:absolute;inset:14px;border:1px dashed rgba(29,33,29,.42)}.asset-placeholder span{position:relative;z-index:1;text-align:center;font-size:12px;letter-spacing:.12em;font-weight:700;color:#43473f}.asset-placeholder small{letter-spacing:0;font-weight:400}.hero-media span{color:#fff}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,27,22,.75),rgba(22,27,22,.12) 70%)}.hero-content{position:relative;z-index:2;padding-top:50px}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:11px;font-weight:700;margin:0 0 18px}.hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(50px,6vw,88px);line-height:.98;font-weight:400;margin:0;max-width:880px}.hero-content>p:not(.eyebrow){font-size:18px;max-width:620px;color:#eeeee8;margin:28px 0}.hero-actions{display:flex;align-items:center;gap:28px}.text-link{font-size:13px;text-transform:uppercase;letter-spacing:.08em}.text-link span{margin-left:8px}.hero-note{position:absolute;z-index:2;right:5%;bottom:45px;display:flex;gap:14px;align-items:center}.hero-note strong{font-size:42px;font-family:Georgia}.hero-note span{font-size:12px;text-transform:uppercase;letter-spacing:.1em}.trust-strip{border-bottom:1px solid var(--line);background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-grid span{text-align:center;padding:22px;border-right:1px solid var(--line);font-size:12px;text-transform:uppercase;letter-spacing:.11em}.trust-grid span:last-child{border:0}.section{padding:110px 0}.section-heading{display:flex;justify-content:space-between;gap:70px;align-items:flex-end;margin-bottom:48px}.section-heading h2,.stats-layout h2,.inquiry-layout h2,.company-layout h2,.factory-layout h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(38px,4vw,60px);line-height:1.05;font-weight:400;margin:0}.section-heading>p{max-width:450px;color:var(--muted);margin:0}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.category-card{background:#fff;border:1px solid var(--line);color:var(--ink);transition:transform .25s,box-shadow .25s}.category-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(29,33,29,.08)}.category-card .asset-placeholder{aspect-ratio:1.1}.category-wide{grid-column:span 2;display:grid;grid-template-columns:1.3fr .7fr}.category-wide .asset-placeholder{aspect-ratio:auto}.card-copy{padding:28px}.card-copy>span{font-size:11px;color:var(--muted)}.card-copy h3{font-size:23px;margin:24px 0 8px}.card-copy p{color:var(--muted);font-size:14px;margin:0}.stats-section{background:var(--cream);padding:100px 0}.stats-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:end}.muted{color:var(--muted);max-width:560px}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid #bbb6aa;border-left:1px solid #bbb6aa}.stats-grid article{padding:36px;border-right:1px solid #bbb6aa;border-bottom:1px solid #bbb6aa}.stats-grid strong{display:block;font:400 46px Georgia}.stats-grid span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.solution-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:48px}.solution-feature{background:#ece8de}.tall{min-height:520px}.solution-copy{padding:36px}.tag{font-size:11px;text-transform:uppercase;letter-spacing:.12em}.solution-copy h3{font:400 36px Georgia;margin:12px 0}.solution-copy p{color:var(--muted)}.solution-copy a,.product-card a{display:inline-block;margin-top:12px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid}.solution-list{border-top:1px solid var(--line)}.solution-list article{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:28px 0;border-bottom:1px solid var(--line)}.solution-list h3{margin:0 0 7px}.solution-list p{color:var(--muted);margin:0;font-size:14px}.product-section{background:#252a25;color:#fff;padding:110px 0}.section-heading.light>p,.product-section .eyebrow{color:#c2c7be}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:30px}.filter{background:transparent;color:#d5d8d1;border:1px solid #555b55;padding:10px 16px;cursor:pointer}.filter.active{background:#fff;color:var(--ink)}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product-card{background:#f5f3ed;color:var(--ink);padding:12px 12px 25px}.product-image{aspect-ratio:.9;min-height:0}.product-type{text-transform:uppercase;letter-spacing:.1em;font-size:10px;color:var(--muted);margin:18px 8px 5px}.product-card h3{font:400 21px Georgia;margin:0 8px 14px}.product-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin:0 8px}.product-card a{margin-left:8px}.product-card.hidden{display:none}.process-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.process-grid li{padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.process-grid span{font:400 28px Georgia;color:var(--sage)}.process-grid h3{margin:32px 0 10px;font-size:18px}.process-grid p{font-size:13px;color:var(--muted)}.projects-section{background:var(--cream);padding:110px 0}.projects-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:18px}.projects-grid article{background:#fff}.projects-grid article>div:last-child{padding:25px}.projects-grid p{font-size:10px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}.projects-grid h3{font:400 25px Georgia;margin:5px 0}.project-main .asset-placeholder{min-height:460px}.projects-grid article:not(.project-main) .asset-placeholder{min-height:300px}.inquiry-section{background:#a9ad9f;padding:110px 0}.inquiry-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.contact-placeholder{display:flex;flex-direction:column;gap:8px;margin-top:40px;border-top:1px solid rgba(29,33,29,.35);padding-top:22px;font-size:13px}.inquiry-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;background:#f7f5ef;padding:38px}.inquiry-form label{display:flex;flex-direction:column;gap:7px;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.inquiry-form input,.inquiry-form select,.inquiry-form textarea{border:1px solid #d6d2c8;background:#fff;padding:13px;min-width:0}.full{grid-column:1/-1}.form-status{margin:0;color:var(--sage);font-size:13px}.site-footer{background:#171a17;color:#d8dbd4;padding:70px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:60px}.footer-grid>div:not(.brand){display:flex;flex-direction:column;gap:8px;font-size:13px;color:#aaaFA8}.footer-grid h3{color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.12em}.footer-bottom{display:flex;justify-content:space-between;margin-top:60px;padding-top:20px;border-top:1px solid #333833;font-size:11px;color:#8e938d}
@media(max-width:980px){.primary-nav,.header-action,.header-cta{display:none}.menu-toggle{display:block}.primary-nav.open{position:absolute;display:flex;flex-direction:column;top:100%;left:0;right:0;background:var(--paper);padding:28px;border-bottom:1px solid var(--line)}.category-grid{grid-template-columns:repeat(2,1fr)}.category-wide{grid-column:span 2}.stats-layout,.solution-grid,.inquiry-layout{grid-template-columns:1fr}.product-grid{grid-template-columns:repeat(2,1fr)}.process-grid{grid-template-columns:repeat(2,1fr)}.projects-grid{grid-template-columns:1fr 1fr}.project-main{grid-column:span 2}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}.footer-grid>div:last-child{display:none}}
@media(max-width:640px){.container{width:min(calc(100% - 28px),var(--max))}.announcement{font-size:9px}.header-inner{min-height:68px}.hero{min-height:650px}.hero h1{font-size:48px}.hero-content>p:not(.eyebrow){font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-note{display:none}.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.trust-grid span:nth-child(2){border-right:0}.trust-grid span{border-bottom:1px solid var(--line)}.section,.product-section,.projects-section,.inquiry-section{padding:78px 0}.section-heading{display:block}.section-heading>p{margin-top:20px}.category-grid,.category-wide{display:grid;grid-template-columns:1fr}.category-wide{grid-column:auto}.category-card{grid-column:auto}.category-wide .asset-placeholder{min-height:240px}.stats-grid{grid-template-columns:1fr}.product-grid,.process-grid,.projects-grid,.inquiry-form{grid-template-columns:1fr}.project-main{grid-column:auto}.product-meta{display:block}.product-meta span{display:block}.full{grid-column:auto}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:span 2}.footer-bottom{gap:20px;flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.audience-links{display:flex;gap:28px;margin-top:30px}
.inner-hero{padding-top:86px}
.inner-hero__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:center}
.inner-hero h1{font:400 clamp(48px,6vw,82px)/1 Georgia,"Times New Roman",serif;margin:0 0 28px}
.lead{font-size:19px;max-width:640px}
.systems-grid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid #bbb6aa;border-left:1px solid #bbb6aa}
.system-card{padding:26px;border-right:1px solid #bbb6aa;border-bottom:1px solid #bbb6aa}
.system-card span,.audience-card>span{font:400 28px Georgia;color:var(--sage)}
.system-card h3{font-size:18px;margin:28px 0 10px}
.system-card p,.audience-card p{font-size:13px;color:var(--muted)}
.audience-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.audience-card{padding:40px;background:#fff;border:1px solid var(--line);scroll-margin-top:120px}
.audience-card h3{font:400 32px Georgia;margin:26px 0 12px}
.audience-card a{display:inline-block;margin-top:18px;border-bottom:1px solid;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.process-grid--six{grid-template-columns:repeat(3,1fr)}
.case-index{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.case-index-card{display:block;padding:32px;border:1px solid #4a4d47;background:#202420}
.case-index-card span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--gold,#b89a5b)}
.case-index-card h3{font:400 30px Georgia;margin:14px 0 8px}
.case-index-card p{color:#bbb7ad;margin:0}
.page-cta{padding:90px 0;background:var(--sage);color:#fff}
.page-cta h2{font:400 clamp(38px,5vw,64px) Georgia;margin:0 0 30px}

@media(max-width:980px){.inner-hero__grid{grid-template-columns:1fr}.systems-grid{grid-template-columns:repeat(2,1fr)}.process-grid--six{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.audience-links{align-items:flex-start;flex-direction:column}.systems-grid,.audience-grid,.case-index,.process-grid--six{grid-template-columns:1fr}.inner-hero__grid{gap:36px}}

.projects-page{padding-top:0}
.projects-page__intro{padding:100px 0 54px;max-width:920px}
.projects-page__intro h1{font:400 clamp(50px,7vw,90px)/1 Georgia,"Times New Roman",serif;margin:0 0 28px}
.projects-page__intro>p:last-child{max-width:720px;color:#bbb7ad;font-size:17px}
.case-index{margin-bottom:120px}
.case-index-card h2{font:400 30px Georgia;margin:14px 0 8px}
.case-study{padding:100px 0;border-top:1px solid var(--project-line);scroll-margin-top:95px}
.case-study__intro{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:end;margin-bottom:45px}
.case-study__intro h2{font:400 clamp(42px,5vw,70px)/1.04 Georgia;margin:0}
.case-study__intro>p{color:#bbb7ad}
.case-facts{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 70px;border-top:1px solid var(--project-line);border-left:1px solid var(--project-line)}
.case-facts div{padding:22px;border-right:1px solid var(--project-line);border-bottom:1px solid var(--project-line)}
.case-facts dt{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--gold)}
.case-facts dd{margin:8px 0 0;font-size:13px;color:#d2cec4}
.case-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding:70px 0 36px}
.case-section h3{font:400 clamp(30px,4vw,48px)/1.05 Georgia;margin:0}
.case-section>div:last-child{color:#bbb7ad}
.case-image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:38px}
.case-image-grid figure{margin:0;background:#20231f}
.case-image-grid img{display:block;width:100%;height:auto}
.case-image-grid figure:nth-child(3){grid-column:1/-1}
.case-image-grid--plans img{object-fit:contain;background:#fff}
.case-image-grid figcaption{padding:12px 14px;color:#9f9b92;font-size:11px}
.case-study>.project-link{margin-top:18px}

@media(max-width:980px){.case-study__intro,.case-section{grid-template-columns:1fr;gap:24px}.case-facts{grid-template-columns:1fr}.case-index{margin-bottom:80px}}
@media(max-width:640px){.projects-page__intro{padding:70px 0 40px}.case-study{padding:70px 0}.case-image-grid{grid-template-columns:1fr}.case-image-grid figure:nth-child(3){grid-column:auto}}

.contact-page{min-height:calc(100vh - 82px)}
.contact-page h1{font:400 clamp(48px,6vw,78px)/1 Georgia,"Times New Roman",serif;margin:0 0 28px}
.preview-notice{margin-top:30px;padding:20px;border:1px solid rgba(29,33,29,.35);font-size:13px}
.inquiry-hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}

/* Local visual assets */
.hero-media img,.media-frame img{width:100%;height:100%;display:block;object-fit:cover}.hero-media img{position:absolute;inset:0}.media-frame{position:relative;overflow:hidden;background:#d8d3c8;min-height:240px}.media-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(20,22,19,.12));pointer-events:none}.category-card .media-frame{aspect-ratio:1.1}.category-wide .media-frame{aspect-ratio:auto}.media-frame.tall{min-height:520px}.product-image{aspect-ratio:.9;min-height:0}.projects-grid .media-frame{min-height:300px}.project-main .media-frame{min-height:460px}.category-card:hover img,.product-card:hover img,.projects-grid article:hover img{transform:scale(1.035)}.media-frame img{transition:transform .45s ease}.source-note{font-size:11px;color:var(--muted);margin-top:14px}
@media(max-width:640px){.category-wide .media-frame{min-height:240px}.media-frame.tall{min-height:360px}.project-main .media-frame{min-height:320px}}

/* Quality and accessibility refinements */
:focus-visible{outline:3px solid #c89b58;outline-offset:3px}
img{max-width:100%;height:auto}
.hero-media img,.media-frame img{height:100%}
.filter[aria-pressed="true"]{background:#fff;color:var(--ink)}
noscript{display:block;padding:12px 20px;background:#fff3cd;color:#3d3417;text-align:center;font-size:13px}
@media(max-width:640px){.inquiry-form{padding:24px}.hero h1{overflow-wrap:anywhere}.header-inner{gap:16px}}

/* Supplied brand and qualified project case studies */
:root{--gold:#b89a5b;--project-ink:#171917;--project-line:rgba(226,218,198,.2)}
.brand-mark{width:46px;height:46px;display:grid;place-items:center;border:0;overflow:hidden;flex:0 0 auto}
.brand-mark img{width:100%;height:100%;display:block;object-fit:contain}

.dark-band .section-heading>p{color:#bbb7ad}
.dark-band .eyebrow{color:var(--gold)}
.projects-list{display:grid;gap:86px}
.project-feature{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px 34px;padding:0 0 86px;border-bottom:1px solid var(--project-line)}
.project-lead{grid-column:1/span 7;min-height:480px}
.project-lead img{object-fit:cover}
.project-copy{grid-column:8/-1;align-self:center;padding:24px 10px}
.project-meta{display:flex;align-items:center;gap:18px;margin-bottom:26px}
.project-meta span{font:400 34px Georgia,"Times New Roman",serif;color:var(--gold)}
.project-meta p{margin:0;color:#bdb8ad;font-size:10px;text-transform:uppercase;letter-spacing:.16em}
.project-copy h3{font:400 clamp(34px,3.4vw,52px)/1.05 Georgia,"Times New Roman",serif;margin:0 0 24px}
.project-summary{color:#cbc7bc;margin:0 0 24px}
.project-copy ul{padding:0 0 0 18px;margin:0 0 28px;color:#a9a59c;font-size:13px}
.project-copy li+li{margin-top:9px}
.project-link{display:inline-block;color:#f5f1e7;padding-bottom:5px;border-bottom:1px solid var(--gold);font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.project-link:focus-visible{outline:2px solid var(--gold);outline-offset:6px}
.project-gallery{grid-column:1/-1;display:grid;grid-template-columns:1.4fr 1fr;gap:14px;align-items:center}
.project-gallery img{display:block;width:100%;height:auto;object-fit:contain;background:#20231f}
.project-feature:nth-child(even) .project-lead{grid-column:6/-1}
.project-feature:nth-child(even) .project-copy{grid-column:1/span 5;grid-row:1}
.project-disclaimer{margin:24px 0 0;color:#9e9a91;font-size:11px;letter-spacing:.05em}
.footer-brand .brand-mark{width:54px;height:54px}
.footer-brand--full{align-items:flex-start}
.footer-brand .brand-mark--full{width:min(230px,100%);height:auto;aspect-ratio:1}
.about-logo{width:min(280px,72%);margin:0 0 28px;background:#fff}
.about-logo img{display:block;width:100%;height:auto}
.language-switch{position:fixed;z-index:40;right:18px;top:8px;display:flex;align-items:center;gap:6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#e8e4d8}
.language-switch a{color:inherit;text-decoration:none;opacity:.72}.language-switch a:hover{opacity:1}.language-switch [aria-current]{font-weight:700;color:#fff}
.network-logo{min-height:112px;display:grid;place-items:center;padding:18px;background:#fff;border:1px solid var(--line)}
.network-logo img{display:block;width:100%;height:76px;object-fit:contain}
.network-mark--text{min-height:112px}
/* 语言选择器用前缀匹配，不是 lang="zh-CN"。
   实测线上两个站发出来的都不是 zh-CN：正式站的 SEO 插件
   (foshan-select-seo/inc/head.php 的 language_attributes 过滤器) 写的是 zh-Hans，
   测试站没启用那个插件、于是中文页还挂着站点区域设置的 en-US。
   结果是这一整层中文排版规则从来没有生效过。前缀匹配把 zh-CN / zh-Hans /
   zh-Hant / zh 一次覆盖掉，插件改口径也不会再让它失效。 */
html[lang^="zh"] body{font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif}
html[lang^="zh"] h1,
html[lang^="zh"] h2,
html[lang^="zh"] .hero h1,
html[lang^="zh"] .projects-grid h3,
html[lang^="zh"] .product-collection h2,
html[lang^="zh"] .placeholder-hero h1,
html[lang^="zh"] .inner-hero h1{font-family:"Songti SC","STSong","Noto Serif SC",serif!important;font-weight:500;letter-spacing:.01em}
html[lang^="zh"] .primary-nav{font-size:12px;letter-spacing:.01em}
html[lang^="zh"] .brand small{letter-spacing:.06em}
html[lang^="zh"] p{line-height:1.85}

@media(max-width:980px){
.project-feature,.project-feature:nth-child(even){grid-template-columns:1fr 1fr}
.project-lead,.project-feature:nth-child(even) .project-lead{grid-column:1/-1;min-height:420px}
.project-copy,.project-feature:nth-child(even) .project-copy{grid-column:1/-1;grid-row:auto;padding:10px 0}
.project-gallery{grid-column:1/-1}
}

@media(max-width:640px){
.projects-section{padding:78px 0}
.projects-list{gap:58px}
.project-feature,.project-feature:nth-child(even){display:grid;grid-template-columns:minmax(0,1fr);gap:20px;padding-bottom:58px}
.project-lead,.project-feature:nth-child(even) .project-lead{grid-column:1;min-height:260px}
.project-copy,.project-feature:nth-child(even) .project-copy{grid-column:1;min-width:0}
.project-copy h3{font-size:34px;overflow-wrap:anywhere}
.project-gallery{grid-column:1;grid-template-columns:minmax(0,1fr)}
.project-gallery img{max-width:100%}
}

/* Foshan Select homepage and shared destinations */
.utility-bar{background:var(--ink);color:#e9e7df;font-size:11px;letter-spacing:.04em}
.utility-bar__inner{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-right:92px}
.header-action{flex:0 0 auto;min-height:42px;padding:0 18px}
.solution-card-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
/* Four solutions (2026-08): a fourth card in a 3-column grid would leave a
   row with one filled cell and two empty ones. 2x2 keeps the band balanced
   and leaves the 29px Georgia headings a readable measure. Same idea as
   .category-grid--five below. */
.solution-card-grid--four{grid-template-columns:repeat(2,1fr)}
.solution-summary{padding:34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.solution-summary>span,.project-type-grid span,.placeholder-grid span{font:400 30px Georgia;color:var(--sage)}
.solution-summary h3{font:400 29px Georgia;margin:34px 0 14px}
.solution-summary p{color:var(--muted)}
.solution-summary a{display:inline-block;margin-top:18px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid}
.category-grid--five .category-card:nth-child(4){grid-column:1/span 1}
.category-grid--five .category-card:nth-child(5){grid-column:2/span 2}
.project-type-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.project-type-grid article{padding:32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.project-type-grid h3{font:400 24px Georgia;margin:28px 0 0}
.selected-project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.selected-project-grid article{background:#202420;border:1px solid var(--project-line)}
.selected-project-grid article>div:last-child{padding:28px}
.selected-project-grid article>div>span{color:var(--gold);font-size:10px;text-transform:uppercase;letter-spacing:.12em}
.selected-project-grid h3{font:400 28px Georgia;margin:14px 0}
.selected-project-grid p{color:#bbb7ad;font-size:13px}
.selected-project-grid .media-frame,.selected-project-grid .asset-placeholder{min-height:300px}
.process-grid--seven{grid-template-columns:repeat(4,1fr)}
.factory-preview{background:var(--sage);color:#fff;padding:110px 0}
.factory-layout,.company-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.factory-layout>div:first-child>p:not(.eyebrow){max-width:560px}
.factory-layout .media-frame,.company-layout .media-frame{min-height:480px}
.factory-layout .source-note{color:#e5e7df}
.placeholder-hero{padding:120px 0 90px;background:var(--cream)}
.placeholder-hero h1{font:400 clamp(52px,7vw,92px)/1 Georgia,"Times New Roman",serif;margin:0 0 24px}
.pending-copy{display:inline-block;margin-top:22px;padding:10px 14px;border:1px solid #bbb6aa;color:var(--muted);font-size:12px}
.placeholder-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.placeholder-grid article{padding:32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.placeholder-grid h3{font:400 25px Georgia;margin:28px 0 10px}
.placeholder-grid p{color:var(--muted);font-size:14px}
.placeholder-grid--five{grid-template-columns:repeat(5,1fr)}

@media(max-width:1120px){
.primary-nav{gap:12px;font-size:12px}
.header-action{padding:0 12px}
}
@media(max-width:980px){
.solution-card-grid,.project-type-grid,.selected-project-grid,.placeholder-grid,.placeholder-grid--five{grid-template-columns:repeat(2,1fr)}
.factory-layout,.company-layout{grid-template-columns:1fr}
.process-grid--seven{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
.utility-contact{display:none}
.utility-bar__inner{justify-content:flex-start}
}
@media(max-width:640px){
.utility-bar__inner{min-height:30px;justify-content:flex-start;text-align:left;padding-right:86px}
.utility-contact{display:none}
.solution-card-grid,.project-type-grid,.selected-project-grid,.placeholder-grid,.placeholder-grid--five{grid-template-columns:1fr}
.category-grid--five .category-card:nth-child(4),.category-grid--five .category-card:nth-child(5){grid-column:auto}
.process-grid--seven{grid-template-columns:1fr}
.factory-preview{padding:78px 0}
.factory-layout,.company-layout{gap:36px}
.factory-layout .media-frame,.company-layout .media-frame{min-height:320px}
.placeholder-hero{padding:80px 0 60px}.placeholder-hero h1{overflow-wrap:anywhere}
}

/* Complete content pages */
.challenge-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.challenge-grid span{padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:13px}
.solution-detail-section{background:var(--cream)}
.solution-detail-list{display:grid;gap:0;border-top:1px solid #bbb6aa}
.solution-detail-list article{display:grid;grid-template-columns:100px 1fr;gap:32px;padding:58px 0;border-bottom:1px solid #bbb6aa}
.solution-detail-list article>span{font:400 42px Georgia;color:var(--sage)}
.solution-detail-list h2,.product-collection h2,.about-contact h2{font:400 clamp(38px,4vw,60px)/1.05 Georgia;margin:0 0 18px}
.solution-detail-list p,.solution-detail-list li{color:var(--muted)}
.product-collection{padding:100px 0}
.product-collection--dark{background:var(--ink);color:#fff}
.product-collection__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:center}
.product-collection:nth-of-type(even) .product-collection__grid .media-frame{order:2}
.product-collection__grid .media-frame{min-height:480px}
.product-collection__grid>div:last-child>span{font:400 38px Georgia;color:var(--sage)}
.product-collection__grid ul{padding-left:18px;color:var(--muted)}
.product-collection--dark .product-collection__grid ul,.product-collection--dark .product-collection__grid p{color:#bbb7ad}
.workflow-diagram{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.workflow-diagram li{position:relative;min-height:280px;padding:32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.workflow-diagram li:not(:last-child):after{content:"→";position:absolute;right:-12px;top:36px;z-index:1;width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;text-align:center}
.workflow-diagram span{font:400 34px Georgia;color:var(--sage)}
.workflow-diagram h2{font:400 24px Georgia;margin:42px 0 12px}
.workflow-diagram p{font-size:13px;color:var(--muted)}
.project-catalog{margin-bottom:120px}
.project-catalog__heading{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:42px}
.project-catalog__heading .eyebrow{grid-column:1/-1;margin-bottom:-38px}
.project-catalog__heading h2{font:400 clamp(42px,5vw,68px)/1 Georgia;margin:0}
.project-catalog__heading p:last-child{color:#bbb7ad}
.project-catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.project-gallery-card{min-width:0;background:#202420;border:1px solid var(--project-line)}
.project-gallery-card__media{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:4px;aspect-ratio:4/3;overflow:hidden;background:#181b18}
.project-gallery-card__media img{display:block;width:100%;height:100%;min-width:0;object-fit:cover}
.project-gallery-card__media .project-gallery-card__main{grid-row:1/3}
.project-gallery-card__copy{padding:24px}
.project-gallery-card__copy span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--gold)}
.project-gallery-card__copy h3{font:400 25px Georgia;margin:12px 0 0}
.selected-project-grid--seven{grid-template-columns:repeat(4,1fr)}
.selected-project-grid--seven h3{font-size:22px}
.network-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.network-card{padding:30px;min-height:230px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.network-mark{width:78px;height:78px;display:grid;place-items:center;border:1px solid var(--gold);color:var(--gold);font:700 18px Georgia}
.network-card h2{font:400 24px Georgia;margin:28px 0 8px}
.network-card p,.network-disclaimer{color:var(--muted);font-size:12px}
.network-disclaimer{margin-top:24px}
.about-contact{padding:110px 0;background:var(--cream);scroll-margin-top:110px}
.about-contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.contact-details{display:grid;border-top:1px solid #bbb6aa}
.contact-details>div{display:grid;grid-template-columns:120px 1fr;padding:24px 0;border-bottom:1px solid #bbb6aa}
.contact-details span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}

@media(max-width:980px){
.product-collection__grid,.about-contact__grid,.project-catalog__heading{grid-template-columns:1fr}
.product-collection:nth-of-type(even) .product-collection__grid .media-frame{order:0}
.workflow-diagram,.network-grid{grid-template-columns:repeat(2,1fr)}
.project-catalog-grid,.selected-project-grid--seven{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
.challenge-grid,.workflow-diagram,.project-catalog-grid,.selected-project-grid--seven{grid-template-columns:1fr}
.project-gallery-card__media{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:2fr 1fr;aspect-ratio:1/1}
.project-gallery-card__media .project-gallery-card__main{grid-column:1/-1;grid-row:1}
.solution-detail-list article{grid-template-columns:1fr;gap:10px}
.product-collection{padding:72px 0}
.product-collection__grid{gap:34px}
.product-collection__grid .media-frame{min-height:300px}
.workflow-diagram li{min-height:0}
.workflow-diagram li:not(:last-child):after{content:"↓";right:auto;left:31px;top:auto;bottom:-12px}
.network-grid{grid-template-columns:1fr}
.network-card{padding:20px;min-height:200px}
.contact-details>div{grid-template-columns:1fr;gap:8px}
}

/* V7 conservative visual polish: rhythm, readability and responsive consistency */
:root{--muted:#62685f}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.section,.product-section,.projects-section,.factory-preview,.inquiry-section{padding-top:104px;padding-bottom:104px}
.section-heading{gap:56px;margin-bottom:44px}
.section-heading>p{line-height:1.75}
.section-heading h2,.stats-layout h2,.inquiry-layout h2,.company-layout h2,.factory-layout h2{letter-spacing:-.018em}
.button{transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}
.button:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(29,33,29,.1)}
.card-copy,.selected-project-grid article>div:last-child,.project-gallery-card__copy{display:flex;flex-direction:column;align-items:flex-start}
.category-card .card-copy{min-height:174px}
.card-copy h3{margin-top:18px;line-height:1.2}
.card-copy p{line-height:1.7}
.selected-project-grid article,.project-gallery-card,.product-card,.category-card{overflow:hidden}
.selected-project-grid article>div:last-child{min-height:174px}
.selected-project-grid h3,.project-gallery-card__copy h3{line-height:1.2}
.selected-project-grid p{margin-top:auto;line-height:1.65}
.project-gallery-card__copy{min-height:122px}
.product-card{transition:transform .25s ease,box-shadow .25s ease}
.product-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(0,0,0,.16)}
.process-grid li,.workflow-diagram li{transition:background-color .2s ease}
.process-grid li:hover,.workflow-diagram li:hover{background:rgba(119,130,113,.045)}
.placeholder-hero{padding-top:108px;padding-bottom:76px}
.placeholder-hero h1{letter-spacing:-.025em;margin-bottom:18px}
.project-catalog{margin-bottom:104px}
.project-catalog__heading{margin-bottom:36px}
.factory-layout,.company-layout{gap:68px}
.factory-layout .media-frame,.company-layout .media-frame{min-height:450px}
.inquiry-layout{gap:72px}
.inquiry-form{padding:34px}
.site-footer{padding-top:64px}
.footer-grid{gap:48px}

html[lang^="zh"] .hero h1,
html[lang^="zh"] .placeholder-hero h1,
html[lang^="zh"] .section-heading h2,
html[lang^="zh"] .stats-layout h2,
html[lang^="zh"] .inquiry-layout h2,
html[lang^="zh"] .company-layout h2,
html[lang^="zh"] .factory-layout h2,
html[lang^="zh"] .project-catalog__heading h2,
html[lang^="zh"] .solution-detail-list h2,
html[lang^="zh"] .product-collection h2,
html[lang^="zh"] .about-contact h2{font-family:"Noto Serif SC","Songti SC",STSong,Georgia,serif;letter-spacing:.01em;line-height:1.16}
html[lang^="zh"] .hero h1{font-size:clamp(46px,5.4vw,78px)}
html[lang^="zh"] .placeholder-hero h1{font-size:clamp(44px,5.8vw,76px)}
html[lang^="zh"] .section-heading h2,
html[lang^="zh"] .stats-layout h2,
html[lang^="zh"] .inquiry-layout h2,
html[lang^="zh"] .company-layout h2,
html[lang^="zh"] .factory-layout h2{font-size:clamp(36px,3.65vw,54px)}
html[lang^="zh"] .card-copy h3,
html[lang^="zh"] .selected-project-grid h3,
html[lang^="zh"] .project-gallery-card__copy h3{line-height:1.38}
html[lang^="zh"] .eyebrow{letter-spacing:.12em}

@media(max-width:980px){
.section,.product-section,.projects-section,.factory-preview,.inquiry-section{padding-top:88px;padding-bottom:88px}
.section-heading{align-items:flex-start;gap:28px;margin-bottom:38px}
.category-card .card-copy,.selected-project-grid article>div:last-child{min-height:0}
.factory-layout,.company-layout,.inquiry-layout{gap:44px}
.placeholder-hero{padding-top:88px;padding-bottom:64px}
.project-catalog{margin-bottom:88px}
}

@media(max-width:640px){
.container{width:min(calc(100% - 32px),var(--max))}
.header-inner{min-height:70px}
.section,.product-section,.projects-section,.factory-preview,.inquiry-section{padding-top:70px;padding-bottom:70px}
.section-heading{display:block;margin-bottom:30px}
.section-heading>p{margin-top:18px;max-width:none}
.hero{min-height:620px}
.hero-content{padding-top:24px}
.hero h1{font-size:clamp(42px,13vw,60px);line-height:1.02}
.hero-content>p:not(.eyebrow){font-size:16px;margin:22px 0}
.hero-actions{align-items:flex-start;flex-direction:column;gap:16px}
.card-copy{padding:22px}
.card-copy h3{font-size:21px;margin-top:14px}
.solution-summary,.project-type-grid article,.placeholder-grid article{padding:24px}
.selected-project-grid article>div:last-child,.project-gallery-card__copy{padding:22px}
.selected-project-grid h3{font-size:25px}
.project-gallery-card__copy h3{font-size:23px}
.process-grid li,.workflow-diagram li{padding:24px}
.process-grid h3{margin-top:22px}
.placeholder-hero{padding-top:68px;padding-bottom:52px}
.placeholder-hero h1{font-size:clamp(40px,12vw,58px)}
.project-catalog{margin-bottom:72px}
.factory-layout .media-frame,.company-layout .media-frame{min-height:290px}
.inquiry-form{padding:24px;gap:14px}
.footer-grid{gap:32px}
.footer-bottom{margin-top:42px;gap:14px;flex-direction:column}
html[lang^="zh"] .hero h1{font-size:clamp(40px,12vw,56px)}
html[lang^="zh"] .placeholder-hero h1{font-size:clamp(38px,11vw,54px)}
html[lang^="zh"] .section-heading h2,
html[lang^="zh"] .stats-layout h2,
html[lang^="zh"] .inquiry-layout h2,
html[lang^="zh"] .company-layout h2,
html[lang^="zh"] .factory-layout h2{font-size:clamp(32px,9vw,44px)}
html[lang^="zh"] p{line-height:1.75}
}


/* v12 content and visual refinement for solutions/about */
:root{--gold:#c8a04f}
.solutions-hero{padding-top:88px;padding-bottom:72px}
.solutions-hero__grid{display:grid;grid-template-columns:.96fr 1.04fr;gap:48px;align-items:center}
.solutions-hero__copy .lead{max-width:650px}
.solutions-hero__tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.solutions-hero__tags span{display:inline-flex;align-items:center;padding:10px 14px;border:1px solid var(--line);background:#fff;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.solutions-hero__media{display:grid;grid-template-columns:1fr .58fr;gap:16px;align-items:end}
.hero-visual{margin:0;border:1px solid var(--line);background:#fff;overflow:hidden;box-shadow:0 14px 32px rgba(29,33,29,.08)}
.hero-visual img,.about-visual img{display:block;width:100%;height:100%;object-fit:cover}
/* 服务页 hero 大图下方那条白边：.hero-visual 用 aspect-ratio 定高，
   而子 img 的 height:100% 在这种容器里解析不出确定高度（实测回退成 auto），
   于是图片按自身 4:3 渲染、比 1.08 的框矮一截，差额露成白边。
   实测 1440px 下差 65px、1200px 下差 26px、1024px 及以下为 0。
   让这个框贴合图片自身比例即可，图片也不用被裁。--small 那张没这个问题，不动。 */
.hero-visual--large{aspect-ratio:auto}
.hero-visual--small{aspect-ratio:.86;transform:translateY(28px)}
.challenge-grid span{display:flex;flex-direction:column;gap:14px;align-items:flex-start;background:#fff}
.challenge-grid strong{font-size:13px;line-height:1.5}
.challenge-icon,.system-icon,.mini-icon,.section-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--gold)}
.challenge-icon{width:36px;height:36px;border:1px solid rgba(200,160,79,.35);background:rgba(200,160,79,.08)}
.challenge-icon svg,.system-icon svg,.mini-icon svg,.section-icon svg{width:20px;height:20px}
.section-icon{width:52px;height:52px;border:1px solid rgba(200,160,79,.4);background:#fff;margin:0 0 18px}
.solution-detail-list ul{padding-left:18px;margin:14px 0 0}
.mini-icon{width:42px;height:42px;border:1px solid rgba(200,160,79,.35);background:#fff;margin:0 0 16px}
.audience-card{background:#fff;border:1px solid var(--line);padding:28px;transition:transform .25s, box-shadow .25s}
.audience-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(29,33,29,.08)}
.about-visual-stack{position:relative;min-height:540px;padding-bottom:36px}
.about-visual{margin:0;border:1px solid var(--line);background:#fff;overflow:hidden;box-shadow:0 16px 36px rgba(29,33,29,.08)}
.about-visual--main{aspect-ratio:1.18;max-width:100%}
.about-visual--detail{position:absolute;right:0;bottom:0;width:40%;aspect-ratio:.77;border:8px solid var(--paper)}
.system-card{background:#fff;display:flex;flex-direction:column;gap:0}
.system-card span{color:var(--sage)}
.system-icon{width:46px;height:46px;border:1px solid rgba(200,160,79,.35);background:rgba(200,160,79,.08);margin:4px 0 14px}
.about-contact .contact-details div{background:#fff}
html[lang^="zh"] .solutions-hero__tags span{letter-spacing:.02em}
html[lang^="zh"] .challenge-grid strong{font-size:14px}
@media(max-width:980px){
  .solutions-hero__grid{grid-template-columns:1fr;gap:32px}
  .solutions-hero__media{grid-template-columns:1fr .72fr}
  .hero-visual--small{transform:none}
  .about-visual-stack{min-height:auto;padding-bottom:120px}
}
@media(max-width:640px){
  .solutions-hero__media{grid-template-columns:1fr;gap:12px}
  .hero-visual--small{aspect-ratio:1.1}
  .challenge-grid span,.audience-card{padding:22px}
  .about-visual-stack{padding-bottom:0;display:grid;gap:12px}
  .about-visual--detail{position:relative;width:100%;border-width:1px}
  .section-icon{width:48px;height:48px}
}


/* v14 contact layout refinement */
.about-contact__grid{align-items:start}
.contact-details{
  align-self:start;
  align-content:start;
  background:#fff;
  border:1px solid #bbb6aa;
  border-top:0;
}
.contact-details>div{
  grid-template-columns:140px minmax(0,1fr);
  align-items:center;
  gap:32px;
  padding:28px 32px;
  min-height:112px;
  background:#fff;
}
.contact-details span{
  font-size:12px;
  letter-spacing:.08em;
  color:var(--muted);
}
.contact-details a,
.contact-details strong{
  display:block;
  font-size:clamp(28px,2.8vw,40px);
  line-height:1.12;
  font-weight:500;
  color:var(--ink);
  word-break:break-word;
}
html[lang^="zh"] .contact-details a,
html[lang^="zh"] .contact-details strong{
  font-size:clamp(24px,2.4vw,34px);
  font-family:inherit;
  font-weight:600;
}
@media(max-width:980px){
  .about-contact__grid{gap:42px}
  .contact-details>div{padding:24px 24px;min-height:96px}
}
@media(max-width:640px){
  .contact-details{border-top:1px solid #bbb6aa}
  .contact-details>div{
    grid-template-columns:1fr;
    gap:10px;
    padding:20px 18px;
    min-height:0;
  }
  .contact-details a,
  .contact-details strong,
  html[lang^="zh"] .contact-details a,
  html[lang^="zh"] .contact-details strong{
    font-size:24px;
    line-height:1.2;
  }
}

.contact-placeholder-value{color:#9a9d96!important;font-weight:400!important;letter-spacing:.08em}


/* v16 challenge marker refinement */
.challenge-grid{counter-reset:challenge}
.challenge-grid > span{counter-increment:challenge}
.challenge-icon{
  position:relative;
  font-family:Georgia,"Times New Roman",serif;
  font-size:15px;
  font-weight:700;
  color:var(--gold);
  letter-spacing:.06em;
}
.challenge-icon svg{display:none}
.challenge-icon::before{
  content:"0" counter(challenge);
  display:block;
  line-height:1;
}


/* v17 products page image harmony refinement */
.product-collection__grid{align-items:center}
.product-collection__grid .media-frame{
  min-height:0;
  aspect-ratio:16 / 9;
  background:linear-gradient(135deg,#e7e1d7,#d5cdc0);
  border:1px solid var(--line);
  box-shadow:0 18px 40px rgba(29,33,29,.08);
}
.product-collection__grid .media-frame img{
  object-fit:cover;
  object-position:center;
}
.product-collection__grid > div:last-child{
  align-self:center;
}
.product-collection__grid ul li + li{margin-top:6px}
.product-collection__grid p{max-width:46ch}
@media(max-width:980px){
  .product-collection__grid .media-frame{aspect-ratio:16 / 10}
}
@media(max-width:640px){
  .product-collection__grid .media-frame{aspect-ratio:4 / 3}
}


/* v18 projects image polish + challenge-number alignment */
.project-gallery-card{
  box-shadow:0 16px 34px rgba(0,0,0,.10);
}
.project-gallery-card__media{
  gap:6px;
  padding:6px;
  background:#161916;
}
.project-gallery-card__media img{
  object-fit:cover;
  object-position:center;
}
.project-gallery-card__copy{
  min-height:132px;
}
.challenge-icon{
  justify-content:center;
  align-items:center;
  text-align:center;
}
.challenge-icon::before{
  width:100%;
  text-align:center;
}


/* v19 contact section harmony refinement */
.about-contact__grid{
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);
  gap:64px;
  align-items:start;
}
.about-contact__grid > div:first-child{max-width:58ch}
.contact-details{
  width:100%;
  max-width:760px;
  justify-self:end;
  background:rgba(255,255,255,.68);
  border:1px solid rgba(187,182,170,.9);
  border-top:1px solid rgba(187,182,170,.9);
  box-shadow:none;
}
.contact-details>div{
  grid-template-columns:118px minmax(0,1fr);
  gap:24px;
  padding:22px 26px;
  min-height:88px;
  background:rgba(255,255,255,.78);
}
.contact-details span{
  font-size:11px;
  letter-spacing:.12em;
  color:#7e8379;
}
.contact-details a,
.contact-details strong{
  font-size:clamp(22px,2.1vw,30px);
  line-height:1.18;
  font-weight:520;
  letter-spacing:-.01em;
}
.contact-details a{max-width:18ch}
html[lang^="zh"] .contact-details a,
html[lang^="zh"] .contact-details strong{
  font-size:clamp(21px,2vw,28px);
  font-weight:600;
  line-height:1.22;
}
.contact-placeholder-value{
  font-size:clamp(19px,1.9vw,24px)!important;
  letter-spacing:.06em!important;
}
@media(max-width:1180px){
  .about-contact__grid{grid-template-columns:1fr;gap:40px}
  .about-contact__grid > div:first-child{max-width:unset}
  .contact-details{max-width:none;justify-self:stretch}
}
@media(max-width:640px){
  .contact-details>div{padding:18px 18px}
  .contact-details a,
  .contact-details strong,
  html[lang^="zh"] .contact-details a,
  html[lang^="zh"] .contact-details strong{font-size:22px}
}


/* v20 compact contact card */
.about-contact__grid{
  grid-template-columns:minmax(0,1.2fr) minmax(300px,.72fr);
  gap:56px;
}
.contact-details{
  max-width:560px;
}
.contact-details>div{
  grid-template-columns:96px minmax(0,1fr);
  gap:18px;
  padding:16px 20px;
  min-height:68px;
}
.contact-details span{
  font-size:10px;
  letter-spacing:.1em;
}
.contact-details a,
.contact-details strong{
  font-size:18px;
  line-height:1.35;
  font-weight:500;
  letter-spacing:0;
}
.contact-details a{max-width:none;word-break:normal;overflow-wrap:anywhere}
html[lang^="zh"] .contact-details a,
html[lang^="zh"] .contact-details strong{
  font-size:18px;
  font-weight:500;
  line-height:1.35;
}
.contact-placeholder-value{
  font-size:18px!important;
  line-height:1.2!important;
}
@media(max-width:1180px){
  .contact-details{max-width:560px;justify-self:start}
}
@media(max-width:640px){
  .contact-details{max-width:none}
  .contact-details>div{
    grid-template-columns:82px minmax(0,1fr);
    gap:14px;
    padding:15px 16px;
  }
  .contact-details a,
  .contact-details strong,
  html[lang^="zh"] .contact-details a,
  html[lang^="zh"] .contact-details strong{
    font-size:16px;
  }
}


/* v21 about story refinement */
.about-story{padding-top:72px;padding-bottom:92px;border-top:1px solid var(--line)}
.about-story__grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:76px;align-items:start}
.about-story h2{font:400 clamp(38px,4.4vw,62px)/1.08 Georgia,"Times New Roman",serif;margin:0;max-width:10ch}
.about-story__copy{max-width:760px}
.about-story__copy p{margin:0;color:var(--muted);font-size:16px;line-height:1.85}
.about-story__copy p+p{margin-top:18px}
html[lang^="zh"] .about-story h2{font-family:"Noto Serif SC","Songti SC",STSong,Georgia,serif;line-height:1.2;max-width:12ch}
html[lang^="zh"] .about-story__copy p{line-height:1.95}
@media(max-width:980px){.about-story__grid{grid-template-columns:1fr;gap:34px}.about-story h2{max-width:none}.about-story__copy{max-width:none}}
@media(max-width:640px){.about-story{padding-top:58px;padding-bottom:68px}.about-story__copy p{font-size:15px}}


/* v27 homepage project-card media fix */
.selected-project-grid .media-frame{
  min-height:0;
  aspect-ratio:4 / 3;
  background:#1a1d19;
}
.selected-project-grid .media-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
@media(max-width:980px){
  .selected-project-grid .media-frame{aspect-ratio:16 / 10}
}
@media(max-width:640px){
  .selected-project-grid .media-frame{aspect-ratio:4 / 3}
}

/* Factory network logo enlargement */
.network-card{display:flex;flex-direction:column}
.network-logo{min-height:144px;padding:10px 12px;background:#fff;border:1px solid var(--line)}
.network-logo img{display:block;width:100%;height:124px;object-fit:contain}
.network-card>.network-mark{width:100%;min-height:144px;aspect-ratio:16/9;height:auto;font:700 28px Georgia}
.network-card h2{margin:22px 0 8px}
@media(max-width:640px){
  .network-logo{min-height:126px;padding:8px 10px}
  .network-logo img{height:108px}
  .network-card>.network-mark{min-height:126px;font-size:24px}
}

/* Factory Network logo enlargement v9 */
.network-card{padding:20px;min-height:280px}
.network-logo{min-height:190px;padding:6px 8px}
.network-logo img{height:175px;width:100%;object-fit:contain}
.network-card>.network-mark{min-height:190px;font-size:32px}
.network-card h2{margin:18px 0 6px}
@media(max-width:640px){
 .network-card{min-height:240px}
 .network-logo{min-height:160px}
 .network-logo img{height:145px}
 .network-card>.network-mark{min-height:160px;font-size:28px}
}

/* ---------------------------------------------------------------------------
   Language switch legibility fix
   .language-switch is position:fixed (z-index 40) while .site-header is
   sticky (z-index 20) with a light background. Once the page scrolls, the
   dark .utility-bar leaves the viewport and the switch's cream text lands on
   the light header - measured contrast 1.22, i.e. invisible, although the
   links still work. Giving the switch its own --ink chip keeps it readable at
   any scroll position; at the top it sits flush inside the utility bar, so
   the header looks unchanged.
   --------------------------------------------------------------------------- */
.language-switch{padding:4px 10px;background:var(--ink)}

/* ---------------------------------------------------------------------------
   Sourcing-challenge section - Solutions page, both languages
   Supersedes the v16 counter treatment above, which hid the SVG icons that
   were already in the markup (.challenge-icon svg{display:none}) and replaced
   them with "01".."06" via a CSS counter.

   Icons are restored and redrawn, each item carries a one-line explanation,
   and the table frame becomes a 1px seam. The chip around the icon is dropped
   so the line work sits directly on the page.

   .challenge-grid and .challenge-item appear only on page-solutions.php and
   templates/zh/solutions.php, so nothing else can be affected. The shared
   rule .challenge-icon,.system-icon,.mini-icon,.section-icon is deliberately
   left untouched - other pages rely on it - and is overridden only when the
   icon sits inside .challenge-grid.
   --------------------------------------------------------------------------- */
.challenge-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.challenge-grid > .challenge-item{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  padding:30px 28px 32px;
  background:var(--paper);
  border:0;
}
.challenge-grid .challenge-icon{
  width:auto;
  height:auto;
  padding:0;
  border:0;
  background:none;
}
.challenge-grid .challenge-icon::before{content:none}
.challenge-grid .challenge-icon svg{
  display:block;
  width:32px;
  height:32px;
  stroke-width:1.5;
}
.challenge-grid h3{
  margin:0;
  font-family:inherit;
  font-size:15px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:0;
  text-transform:none;
  color:var(--ink);
}
.challenge-grid p{
  margin:0;
  font-size:13px;
  line-height:1.75;
  color:var(--muted);
}
@media(max-width:980px){
  .challenge-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .challenge-grid{grid-template-columns:1fr}
  .challenge-grid > .challenge-item{padding:24px 22px 26px}
}

/* ---------------------------------------------------------------------------
   Projects page - case descriptions
   Each card previously carried a category tag and a title and nothing else:
   seven cases, twenty-one photographs, zero words of explanation. A short
   description now sits under each title, so the page can answer the question
   a buyer actually arrives with - "have you delivered something like mine,
   and to what scope".
   .projects-page__note carries the anonymisation notice under the page title;
   the photography has client identifiers removed, and saying so plainly reads
   as discretion rather than as a caveat.
   --------------------------------------------------------------------------- */
.project-gallery-card__copy p{
  margin:10px 0 0;
  font-size:13px;
  line-height:1.7;
  color:#bbb7ad;
}
.project-gallery-card__copy{min-height:0}
.projects-page__note{
  margin:-14px 0 28px;
  max-width:640px;
  font-size:13px;
  line-height:1.6;
  color:#8d897f;
}

/* ---------------------------------------------------------------------------
   Language switch, relocated into the header row
   It used to be position:fixed in the top-right corner, overlapping the
   utility bar. Even after the contrast fix it read as stray 11px text rather
   than a control, and people looking for a language button did not find it.
   It now sits in the header row beside the call to action - where a language
   control is normally looked for - and rides along with the sticky header, so
   it stays reachable at any scroll position.
   --------------------------------------------------------------------------- */
.header-inner .language-switch{
  position:static;
  z-index:auto;
  padding:5px 10px;
  background:transparent;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:11px;
  gap:5px;
  white-space:nowrap;
}
.header-inner .language-switch a{color:var(--muted);opacity:1}
.header-inner .language-switch a:hover{color:var(--ink)}
.header-inner .language-switch [aria-current]{color:var(--ink);font-weight:700}
.header-inner .language-switch [aria-hidden]{color:var(--line)}
@media(max-width:820px){
  .header-inner .language-switch{padding:4px 8px;font-size:10px}
}

/* ---------------------------------------------------------------------------
   Factory network grid - stop the columns blowing past their container
   grid-template-columns:repeat(4,1fr) resolves to minmax(auto,1fr), and the
   auto floor refuses to shrink below each card's min-content width. Four
   cards then measured 1489px inside a 1280px container and pushed a
   horizontal scrollbar onto the page. minmax(0,1fr) plus min-width:0 lets the
   tracks share the container as intended. This predates the move of the
   section onto the About page - the retired Factory Network page carried the
   same markup and the same overflow.
   --------------------------------------------------------------------------- */
.network-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.network-card{min-width:0}
.network-logo img{max-width:100%}
@media(max-width:980px){.network-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.network-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------------------------------------------------------------------------
   Why Foshan Select page
   Structure: platform background -> industry figures -> five tracks -> how we
   work. The figures come first among the evidence because they carry the
   argument: a buyer wants to know the scale behind the pricing before reading
   what the platform is for.
   Scoped to .wf-* which appears only on page-why-foshan.php and
   templates/zh/why-foshan.php.
   --------------------------------------------------------------------------- */
/* The platform block used to carry its own two-column shell (.wf-intro): the
   heading on the left, the body copy and the three benefit tiles squeezed into
   a .85fr column on the right. Two things were wrong with it. .wf-intro never
   declared a font for its h2, and there is no global h2 rule in this file, so
   the heading fell back to the browser default - 24px bold sans, the only
   non-serif heading on the site. And the left column held nothing but the
   heading, which left a large hole beneath it while the tiles were down to
   129px wide at 1024px. The block now uses the same .section-heading row as
   every other section on the page and the tiles run the full width, matching
   the figures strip and the notes below. */
.wf-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line)}
.wf-benefits > div{background:var(--cream);padding:28px 26px 30px;min-width:0}
.wf-benefits b{display:block;font-family:Georgia,"Noto Serif CJK SC",serif;font-weight:400;
  font-size:22px;line-height:1.3;color:var(--ink);margin-bottom:8px}
.wf-benefits span{font-size:13px;line-height:1.75;color:var(--muted)}

/* This heading is longer than the other section headings here, so the two
   column heading row runs out of width well before .section-heading's own
   640px stacking point: stack it from 1100px down, or it wraps to five lines. */
@media(max-width:1100px){
  #platform .section-heading{display:block}
  #platform .section-heading > p{max-width:none;margin-top:18px}
}

.wf-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);margin-top:40px}
.wf-stats > div{background:var(--paper);padding:30px 22px 28px;display:flex;
  flex-direction:column;gap:10px;min-width:0}
.wf-stats .n{font-family:Georgia,"Noto Serif CJK SC",serif;font-weight:400;font-size:34px;
  line-height:1.2;color:var(--gold);letter-spacing:-.01em}
.wf-stats .l{font-size:13px;font-weight:600;line-height:1.45;color:var(--ink)}
.wf-stats .s{font-size:12px;line-height:1.5;color:var(--muted)}

.wf-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-top:0}
.wf-notes > div{background:var(--cream);padding:28px 26px 30px;min-width:0}
.wf-notes h3{margin:0 0 10px;font-family:Georgia,"Noto Serif CJK SC",serif;font-weight:400;
  font-size:19px;line-height:1.35;color:var(--ink);text-transform:none;letter-spacing:0}
.wf-notes p{margin:0;font-size:13px;line-height:1.75;color:var(--muted)}

/* Five tracks.
   The regional-linkage column was removed at the client's request. A table
   row carrying only a four-character sector name and a short statement left
   roughly 600px of empty space to the right of every line, so the rows became
   cards instead - the same grid language as the figures strip above, which
   fills the width honestly rather than stretching two short fields across it. */
.wf-tracks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);margin-top:40px}
.wf-tracks__card{background:var(--paper);padding:26px 22px 28px;min-width:0;
  display:flex;flex-direction:column;gap:10px}
.wf-tracks .no{font-family:Georgia,serif;font-size:15px;line-height:1.4;color:var(--gold)}
.wf-tracks h3{margin:0;font-family:inherit;font-size:15px;font-weight:600;line-height:1.5;
  color:var(--ink);text-transform:none;letter-spacing:0}
.wf-tracks .pos{margin:0;font-size:13px;line-height:1.7;color:var(--muted)}

.wf-approach{margin-top:44px;border:1px solid var(--line);background:var(--ink);
  padding:38px 40px;display:grid;grid-template-columns:1fr 1.4fr;gap:36px;align-items:start}
.wf-approach .tag{display:block;font-size:10px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.wf-approach h3{margin:0;font-family:Georgia,"Noto Serif CJK SC",serif;font-weight:400;
  font-size:24px;line-height:1.4;color:#fff;text-transform:none;letter-spacing:0}
.wf-approach p{margin:0;font-size:14px;line-height:1.8;color:#bbb7ad}

@media(max-width:980px){
  .wf-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .wf-tracks{grid-template-columns:repeat(3,minmax(0,1fr))}
  .wf-approach{grid-template-columns:1fr;gap:20px;padding:30px 26px}
}
@media(max-width:640px){
  .wf-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wf-notes{grid-template-columns:1fr}
  .wf-benefits{grid-template-columns:1fr}
  .wf-tracks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  /* Two columns leave each card about 170px wide, too narrow for the English
     positioning line - the cards ended up 89px apart in height. */
  .wf-tracks{grid-template-columns:minmax(0,1fr)}
}

/* Services page: connected challenge matrix, solution chapters and process. */
.services-challenges .section-heading{margin-bottom:44px}
.challenge-matrix{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
  background:var(--line);
}
.challenge-matrix__item{
  min-width:0;
  min-height:280px;
  padding:34px 32px 36px;
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  grid-template-rows:auto 1fr;
  column-gap:22px;
  row-gap:30px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:var(--paper);
  transition:background-color .25s ease,color .25s ease;
}
.challenge-matrix__item:nth-child(even){background:var(--cream)}
.challenge-matrix__item:hover{background:#ebe7dc}
.challenge-matrix__number{
  font-family:Georgia,"Noto Serif CJK SC",serif;
  font-size:15px;
  line-height:1;
  color:var(--sage);
}
.challenge-matrix .challenge-icon{
  width:44px;
  height:44px;
  grid-column:2;
  grid-row:1;
  display:grid;
  place-items:center;
  color:var(--sage);
}
.challenge-matrix .challenge-icon svg{
  display:block;
  width:38px;
  height:38px;
  stroke-width:1.45;
}
.challenge-matrix__item>div{
  grid-column:1/-1;
  align-self:end;
}
.challenge-matrix h3{
  margin:0 0 10px;
  font-family:Georgia,"Noto Serif CJK SC",serif;
  font-size:23px;
  font-weight:400;
  line-height:1.3;
  color:var(--ink);
}
.challenge-matrix p{
  margin:0;
  max-width:32em;
  font-size:13px;
  line-height:1.75;
  color:var(--muted);
}

.services-solutions{
  padding:110px 0;
  background:var(--cream);
  color:var(--ink);
}
.services-solutions__heading{
  display:grid;
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
  gap:72px;
  align-items:end;
  margin-bottom:54px;
}
.services-solutions__heading .eyebrow{color:var(--sage)}
/* Added 2026-08 with the fourth solution. The eyebrow and this lead now share
   the left column of the heading grid, so the grid still has exactly two
   children and the h2 keeps its own column. */
.services-solutions__lead{
  margin:14px 0 0;
  max-width:40ch;
  font-size:15px;
  line-height:1.75;
  color:var(--muted);
}
.services-solutions__heading h2{
  margin:0;
  max-width:760px;
  font-family:Georgia,"Noto Serif CJK SC",serif;
  font-size:clamp(38px,4vw,58px);
  font-weight:400;
  line-height:1.08;
}
.solution-chapter-list{
  border-top:1px solid var(--line);
}
.solution-chapter{
  scroll-margin-top:120px;
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
  gap:72px;
  padding:68px 56px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  border-left:1px solid var(--line);
  background:var(--paper);
}
/* Alternating bands. Was :nth-child(2) when there were three chapters; with a
   fourth added in 2026-08 the rule is on :nth-child(even) so the rhythm keeps
   working if a fifth is ever added. The paired :nth-child(2) rules further
   down set the same values as their base rules, so they are left alone. */
.solution-chapter:nth-child(even){
  background:#ebe7dc;
  color:var(--ink);
  border-color:var(--line);
}
.solution-chapter:nth-child(odd){background:var(--paper)}
.solution-chapter__identity{
  display:grid;
  grid-template-columns:52px 52px;
  grid-template-rows:auto 1fr;
  gap:26px 18px;
  align-content:start;
}
.solution-chapter__number{
  font-family:Georgia,"Noto Serif CJK SC",serif;
  font-size:16px;
  color:#b89a5b;
}
.solution-chapter .section-icon{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  color:#b89a5b;
}
.solution-chapter .section-icon svg{width:40px;height:40px}
.solution-chapter__identity h2{
  grid-column:1/-1;
  margin:14px 0 0;
  font-family:Georgia,"Noto Serif CJK SC",serif;
  font-size:clamp(31px,3vw,46px);
  font-weight:400;
  line-height:1.1;
}
.solution-chapter__content{
  max-width:720px;
  padding-top:2px;
}
.solution-chapter__fit{
  margin:0 0 24px;
  padding-bottom:22px;
  border-bottom:1px solid var(--line);
  font-size:14px;
  line-height:1.75;
  color:var(--muted);
}
.solution-chapter:nth-child(2) .solution-chapter__fit{
  border-color:var(--line);
  color:var(--muted);
}
.solution-chapter__fit span{
  display:block;
  margin-bottom:8px;
  color:#b89a5b;
  font-size:10px;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.solution-chapter__summary{
  margin:0 0 28px;
  font-size:17px;
  line-height:1.85;
  color:var(--ink);
}
.solution-chapter:nth-child(2) .solution-chapter__summary{color:var(--ink)}
.solution-chapter__actions{
  list-style:none;
  margin:0;
  padding:0;
}
.solution-chapter__actions li{
  position:relative;
  margin:0;
  padding:14px 0 14px 28px;
  border-top:1px solid var(--line);
  font-size:13px;
  line-height:1.65;
  color:var(--muted);
}
.solution-chapter:nth-child(2) .solution-chapter__actions li{
  border-color:var(--line);
  color:var(--muted);
}
.solution-chapter__actions li:before{
  content:"";
  position:absolute;
  top:25px;
  left:1px;
  width:13px;
  height:1px;
  background:#b89a5b;
}

.services-process .section-heading{margin-bottom:46px}
.services-process .workflow-diagram{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
}
.services-process .workflow-diagram li{
  position:relative;
  min-width:0;
  min-height:245px;
  padding:34px 28px 32px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:var(--paper);
}
.services-process .workflow-diagram li:nth-child(n+5){background:var(--cream)}
.services-process .workflow-diagram li:before{
  content:"";
  position:absolute;
  top:-4px;
  left:27px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--sage);
}
.services-process .workflow-diagram span{
  font:400 28px Georgia,"Noto Serif CJK SC",serif;
  color:var(--sage);
}
.services-process .workflow-diagram h2{
  margin:34px 0 10px;
  font-family:inherit;
  font-size:17px;
  font-weight:600;
  line-height:1.4;
}
.services-process .workflow-diagram p{
  margin:0;
  font-size:13px;
  line-height:1.7;
  color:var(--muted);
}

.services-final-cta{
  padding:90px 0;
  background:var(--sage);
  color:#fff;
}
.services-final-cta__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:72px;
  align-items:end;
}
.services-final-cta .eyebrow{color:#e4e7e0}
.services-final-cta h2{
  margin:0;
  max-width:850px;
  font-family:Georgia,"Noto Serif CJK SC",serif;
  font-size:clamp(40px,4.5vw,66px);
  font-weight:400;
  line-height:1.05;
}
.services-final-cta__actions{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:250px;
}
.button-outline-light{
  border-color:rgba(255,255,255,.62);
  background:transparent;
  color:#fff;
}
.button-outline-light:hover,.button-outline-light:focus-visible{
  border-color:#fff;
  background:rgba(255,255,255,.08);
}

@media(max-width:980px){
  .challenge-matrix{grid-template-columns:repeat(2,minmax(0,1fr))}
  .services-solutions__heading,
  .solution-chapter,
  .services-final-cta__inner{grid-template-columns:minmax(0,1fr)}
  .services-solutions__heading,
  .solution-chapter{gap:38px}
  .solution-chapter{padding:54px 42px}
  .services-process .workflow-diagram{grid-template-columns:repeat(2,minmax(0,1fr))}
  .services-final-cta__actions{min-width:0;max-width:360px}
}
@media(max-width:640px){
  .challenge-matrix{grid-template-columns:minmax(0,1fr)}
  .challenge-matrix__item{
    min-height:0;
    padding:26px 22px 28px;
    grid-template-columns:38px 46px minmax(0,1fr);
    grid-template-rows:auto;
    gap:18px;
    align-items:start;
  }
  .challenge-matrix .challenge-icon{grid-column:2;grid-row:1;width:46px;height:42px}
  .challenge-matrix__item>div{grid-column:3;align-self:start}
  .challenge-matrix h3{font-size:20px}
  .services-solutions{padding:78px 0}
  .services-solutions__heading{margin-bottom:38px}
  .solution-chapter{padding:42px 24px;gap:32px}
  .solution-chapter__identity{grid-template-columns:44px 48px;gap:22px 14px}
  .solution-chapter .section-icon{width:48px;height:48px}
  .solution-chapter__summary{font-size:15px}
  .services-process .workflow-diagram{
    grid-template-columns:minmax(0,1fr);
    border:0;
    position:relative;
  }
  .services-process .workflow-diagram:before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:18px;
    width:1px;
    background:var(--line);
  }
  .services-process .workflow-diagram li{
    min-height:0;
    padding:5px 0 34px 54px;
    border:0;
    background:transparent;
  }
  .services-process .workflow-diagram li:nth-child(n+5){background:transparent}
  .services-process .workflow-diagram li:before{
    top:9px;
    left:14px;
    width:9px;
    height:9px;
    border:2px solid var(--paper);
  }
  .services-process .workflow-diagram h2{margin:12px 0 8px}
  .services-final-cta{padding:72px 0}
  .services-final-cta__inner{gap:36px}
  .services-final-cta__actions{max-width:none}
  .services-final-cta__actions .button{width:100%;padding-right:16px;padding-left:16px}
}

/* About contact: editorial numbered list */
.contact-details--editorial{
  width:100%;
  max-width:640px;
  justify-self:end;
  align-self:start;
  background:transparent;
  border:0;
  box-shadow:none;
}
.contact-detail-row{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 24px;
  gap:20px;
  align-items:center;
  min-width:0;
  padding:25px 0;
  border-bottom:1px solid #bbb6aa;
  color:var(--ink);
}
.contact-detail-row:first-child{border-top:1px solid #bbb6aa}
a.contact-detail-row{transition:background-color .2s ease,padding .2s ease}
a.contact-detail-row:hover,
a.contact-detail-row:focus-visible{
  padding-right:12px;
  padding-left:12px;
  background:rgba(119,130,113,.08);
  outline:none;
}
.contact-detail-row__number{
  color:#b89a5b;
  font:400 18px Georgia,"Noto Serif CJK SC",serif;
}
.contact-detail-row__copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:7px;
}
.contact-detail-row__copy>span{
  color:var(--muted);
  font-size:10px;
  letter-spacing:.13em;
  text-transform:uppercase;
}
html[lang^="zh"] .contact-detail-row__copy>span{
  letter-spacing:.1em;
  text-transform:none;
}
.contact-detail-row__copy strong{
  overflow-wrap:anywhere;
  font-size:clamp(18px,1.7vw,22px);
  font-weight:500;
  line-height:1.35;
}
.contact-detail-row__arrow{
  color:#b89a5b;
  font-size:20px;
  transition:transform .2s ease;
}
a.contact-detail-row:hover .contact-detail-row__arrow,
a.contact-detail-row:focus-visible .contact-detail-row__arrow{
  transform:translate(3px,-3px);
}
@media(max-width:1180px){
  .about-contact__grid{
    grid-template-columns:minmax(0,1fr);
    gap:40px;
  }
  .contact-details--editorial{
    max-width:none;
    justify-self:stretch;
  }
}
@media(max-width:640px){
  .contact-detail-row{
    grid-template-columns:30px minmax(0,1fr) 20px;
    gap:12px;
    padding:20px 0;
  }
  .contact-detail-row__copy strong{font-size:17px}
  a.contact-detail-row:hover,
  a.contact-detail-row:focus-visible{
    padding-right:8px;
    padding-left:8px;
  }
}
@media(prefers-reduced-motion:reduce){
  a.contact-detail-row,
  .contact-detail-row__arrow{transition:none}
}

/* ---------------------------------------------------------------------------
   Hero alignment across the menu pages
   The site had grown four hero shells: .hero for the front page, then
   .placeholder-hero, .placeholder-hero.solutions-hero and a second base class
   .inner-hero, while the Projects page had no hero at all and opened straight
   into the catalogue. The front page keeps its own full-bleed hero - it is
   genuinely a different thing. Every inner page now shares .placeholder-hero
   as the base, with .inner-hero and .solutions-hero as modifiers on top.
   --------------------------------------------------------------------------- */
/* No padding override: About now sits on the base rhythm like the rest.
   .solutions-hero keeps its own, set deliberately when that page was
   redesigned, so it is left alone. */
.placeholder-hero .projects-page__note{margin:18px 0 0;max-width:640px;font-size:13px;line-height:1.6;color:var(--muted)}
.projects-hero .lead{max-width:680px}
.projects-page__intro{margin:0}


/* ---------------------------------------------------------------------------
   .dark-band - the dark full-bleed treatment, as a theme and nothing else
   It replaces the colour half of .projects-section, which was also serving as
   the Projects page's <main>. A page container carrying a colour scheme is why
   giving that page's hero a cream background left its text pale: the hero was
   inheriting from the container. Anything that needs to go dark wraps in this;
   nothing inherits a theme by accident.
   --------------------------------------------------------------------------- */
.dark-band{background:var(--project-ink);color:#f5f1e7;padding:104px 0}
.dark-band .eyebrow{color:var(--gold)}
.dark-band .section-heading>p{color:#bbb7ad}
.projects-page{padding:0}
@media(max-width:980px){.dark-band{padding:88px 0}}
@media(max-width:640px){.dark-band{padding:70px 0}}

/* ---------------------------------------------------------------------------
   Key terms - replaces the trust strip on the home page
   The strip listed capabilities: "Multi-Factory Coordination", "Solutions for
   Real Projects". None of that can be checked, quoted against or acted on, so
   a procurement manager left the first screen knowing nothing they could use.
   These six are the questions that actually come first in a B2B enquiry, and
   each states either a figure or how the figure is arrived at.
   --------------------------------------------------------------------------- */
.key-terms{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  margin-top:36px;
}
.key-terms > div{background:var(--paper);padding:26px 24px 28px;min-width:0;
  display:flex;flex-direction:column}
.key-terms .k{font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#9a958a}
.key-terms .v{display:block;flex:1 0 auto;margin:12px 0 8px;
  font-family:Georgia,"Noto Serif CJK SC",serif;font-weight:400;font-size:20px;
  line-height:1.35;color:var(--ink)}
.key-terms p{margin:0;font-size:12px;line-height:1.7;color:var(--muted)}
@media(max-width:980px){.key-terms{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.key-terms{grid-template-columns:minmax(0,1fr)}}

/* ---------------------------------------------------------------------------
   Compact inner-page heroes
   The Why Foshan Select hero filled 83% of a 900px viewport and About went past
   a full screen, so a visitor arrived at a title and had to scroll before
   seeing anything they came for. Home, Our Services and About keep the full
   treatment - they are the pages where the opening statement does real work.
   Everywhere else the eyebrow and lead stay, the headline drops to a size that
   still reads as a page title, and the padding tightens.
   --------------------------------------------------------------------------- */
.placeholder-hero{padding:66px 0 58px}
.placeholder-hero h1{
  font-size:clamp(34px,4.4vw,52px);
  line-height:1.14;
  margin:10px 0 0;
}
.placeholder-hero .lead{
  margin:16px 0 0;
  max-width:640px;
  font-size:15px;
  line-height:1.75;
}
/* About and Our Services run a two-column hero with photography, so their
   height comes from the images rather than the type. About stacks a detail
   shot over a main one behind a 540px floor, which alone was taller than the
   text beside it; the overlap is deliberate, so it is kept and scaled down
   rather than unstacked. */
.inner-hero__grid,.solutions-hero__grid{gap:48px}
.solutions-hero__grid img{max-height:300px;object-fit:cover}
.about-visual-stack{min-height:0;padding-bottom:24px}
.inner-hero .about-visual--main{aspect-ratio:1.6;max-height:280px}
.inner-hero .about-visual--main img{height:100%;object-fit:cover}
.inner-hero .about-visual--detail{width:34%;aspect-ratio:1;border-width:6px}
.inner-hero .lead,.solutions-hero .lead{max-width:none}
.inner-hero .muted{font-size:14px;line-height:1.75}
@media(max-width:640px){
  .placeholder-hero{padding:48px 0 44px}
  .inner-hero__grid img,.solutions-hero__grid img{max-height:220px}
}

/* ---------------------------------------------------------------------------
   Category cards: reflow before the copy runs out of width
   .category-grid stayed at three columns down to 640px while the container
   kept narrowing, so between 980px and 640px the card text overran its box by
   40-150px horizontally - .category-card sets overflow:hidden for the hover
   zoom, so the ends of words were cut. The five-card row rule compounded it by
   forcing card 5 to span two columns.
   Two columns from 980px, one from 720px, and the span override released.
   --------------------------------------------------------------------------- */
@media(max-width:980px){
  .category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .category-grid--five .category-card:nth-child(4),
  .category-grid--five .category-card:nth-child(5),
  .category-wide{grid-column:auto}
  .category-wide{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:720px){
  .category-grid{grid-template-columns:minmax(0,1fr)}
}

/* Below the two-column breakpoint the hero photography stacks under the text,
   which pushed Our Services to 1538px on a 640px screen - the visitor scrolled
   past a screen and a half of introduction before reaching the page. On narrow
   screens the text carries the hero on its own; the same photography appears
   further down both pages. */
@media(max-width:980px){
  .inner-hero .about-visual-stack,
  .solutions-hero__grid > *:last-child:has(img){display:none}
  .inner-hero__grid,.solutions-hero__grid{grid-template-columns:minmax(0,1fr)}
}

/* ---------------------------------------------------------------------------
   WhatsApp QR in the contact list
   The row used to print a phone number and link out to wa.me, which works on a
   phone but leaves a desktop visitor copying digits by hand. A code they can
   scan with the phone already in their pocket is the shorter path - and for an
   overseas buyer it avoids retyping a +86 number.
   The row keeps its shape; the arrow is replaced by the code.
   --------------------------------------------------------------------------- */
.contact-detail-row--qr{cursor:default}
.contact-detail-row--qr:hover{background:none}
/* The row is a grid, not a flexbox - its third track is 24px, sized for the
   arrow it normally holds. Flex properties on the image did nothing; the track
   has to be widened on the row itself. */
.contact-detail-row--qr{grid-template-columns:42px minmax(0,1fr) 132px;align-items:center}
/* 52px 的码扫不出来：wa.me 那串网址是 29×29 模块，去掉内边距只剩 40px 净码区，
   每个模块 1.4px，相机认不出来。一个模块至少要 3–4 CSS px 才稳，
   29 × 4 ≈ 116px 净码区 → 加上 7px 内边距和 1px 边框就是 132px。手机 112px。 */
.contact-qr{
  width:132px;
  height:132px;
  display:block;
  background:#fff;
  border:1px solid var(--line);
  padding:5px;
}
@media(max-width:640px){
  .contact-detail-row--qr{grid-template-columns:36px minmax(0,1fr) 112px}
  .contact-qr{width:112px;height:112px}
}

/* 首页 / 询盘区：原来这里印着明文 WhatsApp 号码，换成同一张二维码 + 一行说明。 */
.contact-placeholder__qr{display:flex;align-items:center;gap:16px;margin-top:8px}
.contact-placeholder__qr img{flex:0 0 auto;display:block;width:132px;height:132px;
  background:#fff;border:1px solid rgba(29,33,29,.25);padding:7px}
.contact-placeholder__qr b{display:flex;flex-direction:column;gap:5px;
  font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.contact-placeholder__qr em{font-style:normal;font-weight:400;font-size:13px;
  letter-spacing:0;text-transform:none;color:rgba(29,33,29,.75);line-height:1.55}
@media(max-width:640px){
  .contact-placeholder__qr img{width:112px;height:112px}
}